<html>
<head>
<style>
#headarea{
width:100%;
height:20%;
border:1px solid red;
}
#leftarea{
width:30%;
height:100%;
border:1px solid red;
float:left;
}
#mainarea{
width:70%;
height:100%;
float:right;
}
#maintemp{
width:100%;
height:60%;
border:1px solid blue;
}
#tailarea{
width:100%;
height:20%;
border:1px solid red;
}
</style>
</head>
<body>
<div id="headarea">
这是head
</div>
<div id="maintemp">
<div id="leftarea">
这是left
</div>
<div id="mainarea">
这是main
</div>
</div>
<div id="tailarea">
这是tail
</div>
</body>
</html>
以上代码在360浏览器7.1版正常运行！
中间涉及到了一点儿关于float的东西，这些东西就是盒子套盒子！
关于浮动:
首先你要给出一个大盒子，当然整个页面也是一个大盒子，但是这个盒子不一定是你想要的额！所以你先确定一个一个盒子，盒子确定了，你开始划分区域！
不管你是左漂还是右漂，结果都是漂不出你定义的盒子对不对？
网上说：使用百分比可能会出间隙，
原因0：边框啊什么的一些固定宽度
原因1：使用百分比时，对像素的计算采用四舍五入！ 没有深入了解，如果有误，希望大家提点！
5635
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
