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

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

如何用CSS进行网页布局

全部评论问答未解决精华

qq_森呼吸_0

讲的真的很不错

0 5-1 混合布局

2016-11-21

慕粉3871729

.main{width:800px; margin:0 auto; background:red; position:relative;}
.left{width:30%; height:700px; background:blue; position:absolute; float:left;}
.right{width:65%; height:700px; background:green;position:absolute; right:0;}
.foot{width:800px; height:150px; background:yellow; margin:0 auto;}

0 5-3 编程挑战

2016-11-21

qq_远心_03762245

.top{background:green;height:50px;width:100%;}
.main{height:500px;width:100%;background:red;position:relative;}
.left{width:29%;height:100%;float:left;background:blue;}
.right{width:70%;height:500px;position:absolute;background:black;right:0px;}
.foot{background:orange;height:30px;width:100%;}

0 5-3 编程挑战

2016-11-21

慕粉3849526

开头声音吵死了

0 1-1 内容简介

2016-11-20

qq_Tom爱Jerry_04335378

老师说话带口音，说到底是哪里人？

0 5-1 混合布局

2016-11-20

岚京

讲得很不错

0 5-1 混合布局

2016-11-20

再去西藏

.top{height:100px;background:#ccc;}
.main{height:600px;background:red;position:relative;}
.left{width:200px;background:blue;height:600px;position:absolute; top:0;left:0;}
.right{background:green;height:600px;margin:0 0 0 210px;}
.foot{height:100px;background:yellow;}

0 5-3 编程挑战

2016-11-19

慕粉4347910

.main{ height:600px; background:#F00; position:relative}
.left{ width:200px; height:600px;background:#00F;}
.right{ height:600px; width:100%;background:#3F9; position:absolute; margin-left:210px;top0}
.foot{ height:100px; background:#F60;margin:0 auto;}

0 5-3 编程挑战

2016-11-19

阿宅233

keyide 加油

2016-11-18

流浪王

body{ margin:0; padding:0; font-size:30px; color:#fff}
.top{height:100px;background:#9CF;}
.main{height:600px;background:red;}
.left{width:200px; height:600px;background:blue;float:left;}
.right{height:600px;background:green;float:right;}
.foot{height:50px;background:yellow;}

定位用float也没问题吧

0 5-3 编程挑战

2016-11-17

qq_厭倦的傷痛_04407504

.main{width:960px;height:600px;margin:0 auto;background:#9FC;}

0 5-2 实践题

2016-11-17

慕盖茨9883178

.top{height:100px;width:;background:gray;}
.main{height:400px;background:red;position:relative;}
.left{height:400px;width:200px;background:pink; }
.right{height:400px;width:100%;background:green;position:absolute;top:0;left:210px;}
.foot{height:50px;background:black;}

0 5-3 编程挑战

2016-11-15

慕尼黑6530071

要求右侧（right）先加载，左侧（left）后加载: <div class="right">right</div>在
<div class="left">left</div>前面就可以实现了，不需要多加修改

2 5-3 编程挑战

2016-11-15

慕尼黑6530071

.top{margin:0 auto;background-color:gray;}
.main{position:relative;height:800px;background-color:red;}
.left{ width:200px;position:absolute;left:0;top:0;height:800px;background-color:blue;}
.right{float:right;height:800px;background-color:green;}
.foot{margin: 0 auto;background-color:orange;}

0 5-3 编程挑战

2016-11-15

神彩

先加载right，后加载left，体现在<body>先写right后写right，已经实现了.right需要设置margin-left。left需要脱离标准文档流，所以要用position:absolute，且要相对于main来定位，所以需要给main设置position:absolute。

.main{background:red;position:relative;}
.left{ width:200px;height:500px;background:blue;position:absolute;top:0;left:0;}

0 5-3 编程挑战

2016-11-14

首页上一页 36 37 38 39 40 41 42 下一页尾页

该课程已下架

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

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

微信扫码，参与3人拼团

热搜

最近搜索清空

如何用CSS进行网页布局