如何用CSS进行网页布局_技术问答

首页免费课如何用CSS进行网页布局问答

如何用CSS进行网页布局

全部评论问答未解决精华

卡妙

老师讲得非常好

0 5-2 实践题

2016-07-01

有问题的锦囊

最新回答 / 慕工程8099857

确实如此。加浮动或者定位都可以，定位的话，将main相对定位，将left绝对定位就可以了，相对浮动较省代码。

1 回答 365 浏览 5-3 编程挑战

2016-06-30

慕娘5454928

给老师点赞

0 5-1 混合布局

2016-06-30

慕莱坞8322415

.right{margin-left:210px;width:100%;height:300px;background:green;position:absolute;}
里面margin-left就是margin：0 0 0 210px

0 5-3 编程挑战

2016-06-30

qq_蝉蝉_03580220

.top{height:100px;background:grey}
.main{height:800px;margin:0px;background:red;}
.left{width:20%;height:800px;float:left;background:blue}
.right{width:79%;height:800px;float:right;background:green}
.foot{height:100px;background:orange;}

1 5-3 编程挑战

2016-06-30

候鸟199011

参考答案应该达不到要求的效果吧，div默认是块级元素，上下排列，使用浮动或者定位才能使其左右排列哦。

2 5-3 编程挑战

2016-06-30

Keasy5

body{ margin:0; padding:0; font-size:30px; color:#fff}
.top{ width:100%, height:300px; background:gray;}
.main{background:red; height:900px;}
.left{ width:29%;height:700px;background:blue; float:left;}
.right{width:70%;height:700px;background:green;float:right;}
.foot{background:orange; clear:both;}

0 5-3 编程挑战

2016-06-28

css布局高度，宽度的具体数值是怎么确定的

已采纳回答 / qq_国尼夫_0

在这个实践中高宽已要求为主如果没有给出具体的高宽度 so可以任定但是前提left和right要根据你的main父元素的高度而铺满,教程的重点是在于引导思路在平时如果效果图中没有给出具体宽高值我们可以利用第三方工具得出具体数值. 希望能帮助到你!

3 回答 1204 浏览 5-3 编程挑战

2016-06-28

好多事的撒旦

.top{height: 100px;background: #ccc;}
.main{height: 500px;width:100%;background:red;}
.left{ height:500px; width: 20%;background: blue;float:left}
.right{height: 500px;width:78% ;background: greenyellow;float: right;}
.foot{height:50px;background: orangered;}

0 5-3 编程挑战

2016-06-28

菲婓翡废铁

声音好小啊

2 1-1 内容简介

2016-06-28

鱼鱼尔

很好感谢^ω^老师

2 5-1 混合布局

2016-06-28

微笑de迪妮莎

css的学习必须仔细加耐心。建议先将单独的元素情况都实现一遍，不然后面出现多个元素的时候就容易思路不清除。接着就是拿psd图来实现，我第一个psd图花了我12个小时。

3 5-3 编程挑战

2016-06-28

qyy2499760117_叶子

.top{width:800px; height:80px; background:#ccc;margin:0 auto;}
.main{width:800px;height:500px;background:red;margin:0 auto;}
.left{ width:200px;height:500px;background:blue;float:left;}
.right{width:590px;height:500px;background:pink;float:right;}

1 5-3 编程挑战

2016-06-28

qyy2499760117_叶子

受教了，不错不错。

0 4-3 编程练习

2016-06-28