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

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

如何用CSS进行网页布局

全部评论问答未解决精华

浮屿散人

慕课网的片头设计很烂。图形动画和音乐都挺差。我发现这也是慕课网都是代码教学类的程序员教程偏多，相应的UI
设计类课程几乎没有。和网易云课堂比这是一个很大的弱项。

2 1-1 内容简介

2017-04-02

海子de微博

点赞。。。。

1 5-3 编程挑战

2017-03-31

Frank810

我觉得应该在外边加一个父容器进行包裹，然后给父容器设置position：relative，这样更加合理些。

2 4-1 三列布局

2017-03-29

改名字啦已经

其实我记不清兼容ie6哪些应该这样。。。。

0 5-3 编程挑战

2017-03-27

改名字啦已经

老师说的很好诶之前看其他网站的教程我都要疯了这里我就知道了加油吧

0 5-1 混合布局

2017-03-27

Ajayy

.top{width:100%; height:50px;background:gray}

.main{width:100%; height:300px;background:red;position:relative}

.left{width:200px;height:300px;background:blue;position:absolute;top:0; left:0;}

.right{margin-left:210px;height:300px;background:green}

.foot{width:100%; height:50px;background:#369}

2 5-3 编程挑战

2017-03-27

Ajayy

“要求右侧（right）先加载，左侧（left）后加载”的意思就是在html布局中right在left的前面。重置代码（原来的代码）可以看到left在right后面。

1 5-3 编程挑战

2017-03-27

Ajayy

大家不觉得这道题有问题吗？
left为200px不变，右侧为继承父元素的100%，导致浏览器下面有横向的滚动栏

1 5-3 编程挑战

2017-03-26

大大大虾仁

属性排成顺眼的方式就容易发现问题啦！
*{ margin:0; padding:0;}
.left{ width:200px; height:600px; background:#ccc; position:absolute; left:0; top:0}
.main{ height:600px; margin:0 310px 0 210px; background:#9CF}
.right{ width:300px; height:600px; background:#FCC; position:absolute; top:0;right:0;}
</style>

0 4-3 编程练习

2017-03-26

大大大虾仁

第一：第十行右边多了一个花括号
第二：要想和效果图一样，把main的width改成大于960即可。970,980都可以

0 3-3 编程练习

2017-03-26

聰_0

body{ margin:0; padding:0; font-size:30px; color:#fff}
.top{height:100px; background:#ccc}
.main{position:re;
.left{ width:200px; height:500px; background:blue; }
.right{ margin-left:210px;height:500px; background:#9C9;}
.foot{ height:50px; background:#F63 }
</style>

0 5-3 编程挑战

2017-03-26

慕粉mammon

66666

0 5-1 混合布局

2017-03-25

慕粉4270678

.top{width:80%;background:gray;height:200px;}
.main{width:80%;height:300px;background:red;}
.left{ width:30%;height:300px;background:blue;float:left;}
.right{width:69%;height:300px;;background:green;float:right;}
.foot{width:80%;height:100px;background:orangered;}

0 5-3 编程挑战

2017-03-25

LittleCRush

.top{width:100%;height:100px;background:gray;}
.main{height:500px;position:relative;}
.left{height:500px;width:200px;background:blue;float:left;}
.right{height:500px;background:green;position:absolute;margin-left:200px ;}
.foot{width:100%;height:30px;background:orange;}

0 5-3 编程挑战

2017-03-22

qq_曦_16

.main{height:960px;background:red;position:relative;}
.left{position:absolute;top:0;left:0;width:200px;height:960px;background:blue;}
.right{height:960px;background:#9fc;margin-left:215px;}
.foot{height:40px;background:#ff6666;}

0 5-3 编程挑战

2017-03-21

首页上一页 22 23 24 25 26 27 28 下一页尾页

该课程已下架

课程须知: 1.你需要掌握html+css样式基础知识 2.有一定的前端实际开发经验

老师告诉你能学到什么？: 1.掌握网页布局的相关知识 2.能对不同的网页进行布局结构划分 3.掌握固定宽度和自适应宽度的实现方法

微信扫码，参与3人拼团

热搜

最近搜索清空

如何用CSS进行网页布局