PHP
·
发表于 5年以前
·
阅读量：8286
左右两栏分别向左右浮动，中间设置margin值，宽度自适应。
<!DOCTYPE html>
<html>
<head>
<title>纯浮动</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<div class="header">Header</div>
<div class="container">
<div class="left">Left</div>
<div class="right">Right</div>
<div class="center">Center</div>
</div>
<div class="footer">Footer</div>
</body>
</html>index.css
body{padding:0;margin:0}
.header,.footer{width:100%; background: #666;height:30px;clear:both;}
.left{
background: #34934D;
width:150px;
float:left;
}
.center{
background: #D6D6D6;
margin-left: 150px;
margin-right: 200px;
}
.right{
background: #EF4400;
width:200px;
float:right;
}需要注意的点：