html部分：
<body>
<div id=‘main‘><div id=‘middle‘></div></div>
<div id=‘left‘></div>
<div id=‘right‘></div>
</body>
css部分：
<style type=‘text/css‘>
html,body{
margin:0;
height:100%;
}
#main{
height:100%;
width:100%;
background:red;
float:left;
}
#middle{
height:100%;
margin:0 210px;
}
#left,#right{ float:left;
height:100%;
width:200px;
background-color:green;
}
#left{
margin-left:-100%；
}
#right{
margin-left:-200px;
}
</style>
首先，中间的主体要使用双层标签。外层div宽度100%显示，并且浮动（本例左浮动，下面所述依次为基础），内层div为真正的主体内容，含有左右210像素的margin值。左栏与右栏都是采用margin负值定位的，左栏左浮动，margin-left为-100%，由于前面的div宽度100%与浏览器，所以这里的-100%margin值正好使左栏div定位到了页面的左侧；右侧栏也是左浮动，其margin-left也是负值，大小为其本身的宽度即200像素。
时间： 2024-08-10 01:54:18