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

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

如何用CSS进行网页布局

全部评论问答未解决精华

in2

div{ text-align:center; line-height:50px ; position:absolute;}
.main{ width:960px; height:600px; margin:0 auto}
.left{ width:300px; height:600px; background:#ccc; float:left;}/*左浮动样式*/
.right{ width:660px; height:600px; background:#FCC; float:right; position:relative; left:30px;}/*右浮动样式*/

0 3-3 编程练习

2015-12-03

bzhn

.left{float: left; left: 0;}
.right{float: right; right: 0}

和

.left{position; absolute; left: 0;}
.right{position; absolute; right: 0}

都是可以实现上面三列布局的

0 4-3 编程练习

2015-12-03

Glow

老师讲的很精彩，对布局有了清晰的认识。我在网上看到一篇文章不错，讲的是如何按照编码规范写出好的代码，不敢私藏，分享给大家。

链接是：http://t.cn/RUDeImC

41 1-1 内容简介

2015-12-02

阳光雨下

想来想去不能把left挤上main里去，看了别人的代码，还是得靠position:absolute来硬上啊。

0 5-3 编程挑战

2015-12-02

阳光雨下

看不到效果的同学，可以在页面上按住ctrl+-缩放浏览器页面，再点效果区全屏就可以看到效果了。我是雷锋

1 4-3 编程练习

2015-12-02

阳光雨下

楼下都太认真了。。把right的宽度减少30px不就出间距了么。。

0 3-3 编程练习

2015-12-02

离尘LC

老师好棒！！！学到了很多知识

0 1-1 内容简介

2015-12-01

爱OS

.top{height:100px;background:#ccc;}
.main{height:600px;margin:0 auto;position:relative; background:red;}
.left{height:600px;width:200px;background:#00f;position:absolute;left:0;top:0;}
.right{height:600px;margin:0px 0px 0px 210px; background:#1d9;}
.foot{height:50px;background:orange;}

1 5-3 编程挑战

2015-11-30

Sunshiner0

给个赞，老师讲课很吸引人

1 5-1 混合布局

2015-11-29

一眼红尘_0

.main{background: red;height:600px;}
.left{ height:600px;width:200px;background:blue;float: left;margin-right: -100%;}
.right{height:600px;float: left;width: 100%;background:green;float:right;}
.foot{height:100px;background: #FF7F24;}

0 5-3 编程挑战

2015-11-29

Lorraine_Kinney

总宽度扩大就能弄出间距

0 3-3 编程练习

2015-11-27

深大刀神

float
position:absolute

2 3-2 评测题目

2015-11-26

哞哞呱呱咩咩

biubiubiu 1297179819@qq.com fighting!

1 5-3 编程挑战

2015-11-26

金山打字桶

好吧，错了，right不用定位就行了。。。

0 5-3 编程挑战

2015-11-26

金山打字桶

.wrap{width:1000px;}
.main{background-color:red;position: relative;width:100%;height:500px;}
.left{background-color:blue;position: absolute;left:0;top:0;width:200px;height:500px;}
.right{background: darkolivegreen;position: absolute0;margin-left:210px;height: 500px;width: 79%;}
外面包裹wrap，不然右边只会出现一小条

0 5-3 编程挑战

2015-11-26

首页上一页 100 101 102 103 104 105 106 下一页尾页

该课程已下架

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

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

微信扫码，参与3人拼团

热搜

最近搜索清空

如何用CSS进行网页布局