-
position:absolute;
position:relative;
查看全部 -
绝对定位 position:absolute; left:0; top:0
position:absolute; right:0; top:0
查看全部 -
css---利用浮动+定位----实现UI
查看全部 -
2018-08-18
查看全部 -
div结尾处清除浮动：clear: both<br />查看全部
-
使div水平居中：margin: 0 auto;
查看全部 -
三列布局:
一：绝对定位
//**左边绝对定位
position: absolute;
left: 0; top: 0;
//**右边绝对定位
position: absolute;
right: 0; top: 0;
//**中间列自适应宽度
margin: 0 300px 0 200px;
(中间空格的话设置310px; 210px;)
查看全部 -
三列布局：
left与right绝对定位，固定宽度；
middle设计左右margin。实现自适应。
查看全部 -
float：right会让div往右边浮动，而.left则已经往左浮动了，故而一个左贴边，一个右贴边，中间自然露出来大片的底色（红色）。所以你这里的margin-left：210px并没有起到实质上的作用，因为中间的区域估计有上千px。要想用浮动来实现这样的效果，必须都设置成float：left。
但是本题的任务要求：右侧（right）先加载，左侧（left）后加载。
而且下面的div代码也是right在前面，left在后面。如果是left在前面，right在后面，那么可以直接使用float：left，从左到右按顺序向左浮动，再设置right的margin-left：10px即可实现。
本题的精髓就在于left在后面，right反而在前面，所以只能只用绝对定位来实现。
查看全部 -
margin:0 auto
查看全部 -
他们设置 310 和210 是为了让效果图和案例一样，中间div和两边有空白的间距。由于中间的div设置的margin 所以，它的距离是相对于body的距离，你疑问为啥不是和左右两个div的距离，是因为，左右两个div由于设置了absolute 脱离了文档流，也就是相当于相对其他div来说，它类似于透明的空气一般。
查看全部 -
元素脱离文档流
不会一个元素一行一行的排版，而是可以拿出来跟在父元素左右，float脱离文档流时，其他盒子会无视这个元素，但其他盒子内的文本依然会为这个元素让出位置，环绕在周围。
查看全部 -
body{margin:0;padding:0;}
.left{width:200px;height:500px;background:#ccc;position:absolute;left:0;top:0}
.middle{height:500px;background:#999;margin:0 300px o 200px}
.right{width:300px;height:500px;background:#ddd;position:absolute;right:0;top:0}
查看全部 -
margin:0 auto//居中对齐
查看全部 -
height:100px margin:0 auto查看全部
举报