.top{width:100%;height:50px;background:gray;}
.main{width:100;height:300px;background:red;position:relative;}
.left{ width:200px;height:300px;background:blue;position:absolute;top:0;left:0;}
.right{height:300px;background:green;margin-left:210px;}
.foot{width:100%;height:50px;background:orange;}
.main{width:100;height:300px;background:red;position:relative;}
.left{ width:200px;height:300px;background:blue;position:absolute;top:0;left:0;}
.right{height:300px;background:green;margin-left:210px;}
.foot{width:100%;height:50px;background:orange;}
最新回答 / Blizzard_lihe
任何元素 element 都可以被浮动。段落、div、list、tables,以及图像都可以被浮动，事实上即使是像 span 和 strong这样的行内置元素也可以很好地进行浮动。任何申明为 float 的元素自动被设置为一个"块级元素", 这表示它可以具有申明的"width"和"height"属性。事实上，floats当前被要求具有一个申明的宽度，但这不是现代浏览器制造者的思路，W3C以及开始同意这样的作法。现在大多数人的意见是没有指定宽度的float应当伸缩包装到浮动内容的宽度。因此，内部带有图片的一...
2016-10-21
不用浮动，用定位方式。
right先加载，代码中right在前。
.top{height:100px; background:#ccc;}
.main{position:relative; background:red;}
.left{position:absolute; top:0; width:200px; height:500px; background:blue;}
.right{margin-left:210px; height:500px; background:#9C9;}
.foot{height:50px; background:#F63;}
right先加载，代码中right在前。
.top{height:100px; background:#ccc;}
.main{position:relative; background:red;}
.left{position:absolute; top:0; width:200px; height:500px; background:blue;}
.right{margin-left:210px; height:500px; background:#9C9;}
.foot{height:50px; background:#F63;}
.top{background:red;height:50px;}定义头部
.main{height:600px; background:green;position:relative;}给爸爸一个框
.left{ width:200px;background:blue;height:600px;float:left;position:absolute;top:0;left:0;}修改大儿子
.right{height:600px; background:yellow;margin-left:210px;}修改二儿子
.foot{background:red; height:50px;}
.main{height:600px; background:green;position:relative;}给爸爸一个框
.left{ width:200px;background:blue;height:600px;float:left;position:absolute;top:0;left:0;}修改大儿子
.right{height:600px; background:yellow;margin-left:210px;}修改二儿子
.foot{background:red; height:50px;}