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

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

如何用CSS进行网页布局

全部评论问答未解决精华

是否需要清除浮动

+ 我来回答回答最高可+2积分

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

2017-03-23

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

为什么第二个div和第三个div宽度不相等

已采纳回答 / Robert_Langdon

你第二个div写成dir了 dir有默认样式的肯定不对了

2 回答 1045 浏览 2-1 一列布局

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

关于float左右浮动

已采纳回答 / 慕粉1617456504

float:left;float:right分别控制相应的元素，悬浮在父元素的左边和右边。如果不添加float元素的话，由于div是块级元素，两个div会靠左上下并排在一起，而不是左右。

2 回答 1129 浏览 3-1 二列布局

2017-03-21

慕粉1048099929

.top{width:100%;height:100px;;background:gray;}
.main{width:100%;height:900px;;background:red;}
.left{width:200px;height:900px;;background:blue;float:left }
.right{width:85%;height:900px;float:right;;background:yellow;float:right;}
.foot{width:100%;;background:gray;clear:both;}

0 5-3 编程挑战

2017-03-21

会飞的画家

老湿好棒！讲解得很有层次，基础又系统！

1 5-1 混合布局

2017-03-21

慕粉4193678

不改字体这样不就行啦
.left{ width:50px; height:600px; background:#ccc; position:absolute;left:0; top:0;font-size:0.5em;}
.main{ height:600px;margin:0 90px 0 60px; background:#9CF;font-size:0.5em;}
.right{ height:600px; width:80px; position:absolute; top:0;right:0; background:#FCC;font-size:0.5em;}

0 4-3 编程练习

2017-03-20

qq_PHP从删库到跑路_0

div不能乱用吧

0 5-1 混合布局

2017-03-20

Toywt

这东西bug多多

0 5-3 编程挑战

2017-03-20

为何居中了以后right就没法自适应了呢？

已采纳回答 / qq_天天_66

其实你的已经自适应了，父级容器的宽为800px,左侧为200px ,margin占了10px ,你的right的宽没有设置，但是他相当于剩下的100%，也就是590px,所以他会占宽590px的，你可以用盒子看一下

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

2017-03-19

Musashi_Tab

啊啊啊

1 2-1 一列布局

2017-03-19

.right{margin:0 0 50px 210px 高按100算不对为什么底部按50和0都是对的？

最赞回答 / 冷凝NO

margin 是按上右下左的顺序定义间距的并且是于相邻的块元素计算，不知道是不是你问的意思，没有太看懂你的问题出的是什么意思

2 回答 1281 浏览 5-3 编程挑战

2017-03-18

慕粉2251258750

.top{height:100px;background:grey;}
.main{height:500px;background:red;}
.left{width:200px;height:500px;background:blue;float:left;position:relative}
.right{width:100%;height:500px;background:green;position:absolute;float:right;margin-left:210px;}
.foot{width:100%;background:yellow;}正确答案在此！

1 5-3 编程挑战

2017-03-18

慕粉2218152275

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

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

.left{float:left;width:200px;height:300px;background:blue;}

.right{float:left;margin-left:210px;width:100%;height:300px;background:green}

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

0 5-3 编程挑战

2017-03-18

慕粉1640181640

另：relative 不脱离文档流，absolute 脱离文档流。也就是说：relative 的元素尽管表面上看到它偏离了原来的位置，但它实际上在文档流中还是没变。absolute的元素不仅位置改变了，同时也脱离了文档流。
position:relative日常应用的时候一般是设置给position:absolute;的父层的,父层position:relative; 子层position:absolute;的话, 就是依照父层的边界进行定位的, 不然position:absolute 会逐层向上寻找设置了position:relative的元素边界, 直到body元素..

3 5-3 编程挑战

2017-03-16

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

该课程已下架

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

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

微信扫码，参与3人拼团

热搜

最近搜索清空