<div class="container">
css is awesome!
</div>
.container {
/* 自适应宽度,最宽 800px */
max-width: 800px;
/* 左右边距自适应以达到居中效果 */
/* margin: 上 右 下 左 / 上下 左右 */
margin: 0 auto;
}
http://jsbin.com/wupune/edit?html,css,output
<div class="container">
<div class="left">
left side!
</div>
<div class="main">
main!
</div>
</div>
.container {
max-width: 800px;
margin: 20px auto;
}
.main {
margin-left: 270px;
background-color: orange;
}
.left {
width: 250px;
float: left;
background-color: gray;
}
中间主栏,两边是侧边栏(固定像素) http://jsbin.com/vegise/edit?html,css,output
中间主栏,两边是侧边栏(百分比) http://jsbin.com/reduje/edit?html,css,output