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

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

如何用CSS进行网页布局

全部评论问答未解决精华

pmxg

.left{width:200px; height:400px; position:absolute; margin-top:-400px; background-color:#00F}
.right{height:400px; position:static; margin-left:210px; background-color:#9c9;}
.foot{height:50px;background-color:#f84;}

0 5-3 编程挑战

2015-09-26

小小前端程序员

谢谢老师无私奉献讲课准确细腻爱你哦

0 5-1 混合布局

2015-09-26

兮兮泡沫

.top{height:70px;background-color:#ccc;}
.main{width:100%;height:500px;margin:0 auto;background:red;}
.left{ width:200px;height:500px;background-color:blue;position:absolute;left 0;top:70px;}
.right{height:500px; background-color:green;margin-left:210px;}
.foot{background-color:#f63;}

1 5-3 编程挑战

2015-09-23

兮兮泡沫

clear:both 清除两边浮动元素

0 5-2 实践题

2015-09-23

兮兮泡沫

.left{ width:200px; height:600px; background:#ccc; position:absolute; left:0; top:0}
.main{ height:600px; margin:0 310px 0 210px;background:#9CF}
.right{ height:600px; width:300px;position:absolute;right:0;top:0; background:#FCC;}

0 4-3 编程练习

2015-09-23

兮兮泡沫

三列布局：不能使用float，左右两列绝对定位，分别靠左和靠右，中间列为相对定位，左右margin分别设置为左右两列的宽度即可，如果列与列之间需要间隔，则增加相应的margin值。

0 4-1 三列布局

2015-09-23

兮兮泡沫

文档流：将窗口自上而下分成一行一行，并在每行中按从左至右的依次排放元素，即为文档流。

有三种情况使得元素离开文档流而存在，分别是浮动绝对布局固定定位

0 3-2 评测题目

2015-09-23

举个栗子233

“然后呢，咱们给它定义一个背景颜色、啊，那么底部呢，我们给它定义一下、啊”。老师啊的好亲切呀，哈哈哈

58 2-1 一列布局

2015-09-23

庄先生和

需要注意的两点：
1.任务2里的右侧宽度自适应
2.任务3里的右侧先加载，左侧后加载

0 5-3 编程挑战

2015-09-23

虞矀人

.top{height:100px;background:#ccc;}
.main{height:500px;background:red;position:relative;}
.left{width:200px;height:500px;background:blue;position:absolute;top:0;}
.right{margin-left:210px;height:500px;background:#9c9;}
.foot{height:50px;background:#f63;}

1 5-3 编程挑战

2015-09-23

庄先生和

建议做这节题时，
1.把第11行和12行里面的maigin：0 auto;去掉，添加到第九行里。
2.把width第9行改成660（或者其他数值）
3.点右上角的收起，就能看到效果了。

23 2-3 编程练习

2015-09-23

我是姚复广

.top{background:#666;height:50px;}
.main{height:600px;width:100%;margin:0 auto; background:#FCC}
.left{width:200px;height:600px;position:absolute; top:50px;left:0;;background:#123;}
.right{height:600px;margin-left:210px;background:green;}
.foot{background:#369;}

0 5-3 编程挑战

2015-09-21

Jessie_Wu

老师那个main我听成慢，口音感人

0 2-3 编程练习

2015-09-20

qq_健哥哥_0

.top{height:100px; background:#ccc;}
.main{ width:100%; height:500px;background:red;}
.left{ width:200px; height:500px; background:blue; position:absolute;left:0; top:100px;}
.right{ width:80%; height:500px; background:green; float:right;}
.foot{ width:100%; height:50px; background:#F63;clear:both;}

0 5-3 编程挑战

2015-09-19

翼风Fly

不是太理解的小伙伴们~张鑫旭大神的段子课程——《CSS深入理解之absolute》也许能有所帮助~~HTML/CSS分类中的高级难度~

1 4-1 三列布局

2015-09-19

首页上一页 107 108 109 110 111 112 113 下一页尾页

该课程已下架

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

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

微信扫码，参与3人拼团

热搜

最近搜索清空

如何用CSS进行网页布局