做如下页面布局：
代码：
<html>
<head>
<style type="text/css">
body{
margin:0;
padding:0;
background-color:#808080;
}
div{
position:relative;
}
#div_top{
background-color:orange;
height:20%;
}
#div_left{
background-color:yellow;
height:80%;
width:15%;
float:left;
}
#div_main{
background-color:red;
height:70%;
width:85%;
float:left;
}
#div_botton{
background-color:green;
height:10%;
width:85%;
float:left;
}
#div_container{
width:80%;
height:100%;
border:0px solid black;
margin-left:10%;
float:left;
}
</style>
</head>
<body>
<div id="div_container">
<div id="div_top">top</div>
<div id="div_left">left</div>
<div id="div_main">main</div>
<div id="div_botton">botton</div>
</div>
</body>
</html>
效果：
其中
position: relative 相对定位，一般会和float,margin,padding......等一起使用；
absolute 绝对定位，需要配合使用left,top;
完结
737
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
