1、雙飛翼佈局簡介
「雙飛翼佈局」能夠比做一隻天使，能夠把center當作是鳥的身體，left和right則是天使的翅膀。這個佈局的實現思路是，先把最重要的身體部分放好，而後再將翅膀移動到適當的地方。（雙飛翼的特色就是給天使的身體上在加上一個盔甲<一個div>）。它的優勢是：代碼比聖盃佈局簡單一些，並且微調的時候較簡單。css
2、代碼以下：
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>雙飛翼佈局</title>
<link rel="stylesheet" href="diu4.css"/>
</head>
<body>
<div class="box">
<div class="rrr">
<div class="center"></div>
寫內容
</div>
<div class="left"></div>
<div class="right"></div>
</div>
</body>
</html>
body{margin:0px;}
.box{
margin:0 auto;
background:red;
position:relative;
height:300px;
}
.left{
height:300px;
width:200px;
float:left;
background:green;
position:absolute;
left:0px;
top:0px;
}
.center{
margin:0px 200px;
}
.right{
height:300px;
width:200px;
float:right;
background:yellow;
position:absolute;
right:0px;
top:0px;
}
.rrr{
margin:0px 200px 0px 200px;
width:100%;
background-color:blue;
height:300px;
}
3、這是效果圖：
