ul 置中方法（用於使用 li 設計的選單）
CSS的垂直置中方式有很多
1. 方法一
HTML
<div class="center-block">置中</div>
CSS
.center-block {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width:400px;
height:200px;
background-color: #cccccc;
margin:auto;
}
2. 方法二
HTML
<div class="center-block">置中</div>
CSS
.center-block {
position:absolute;
width: 400px;
height:400px;
top:50%;
left: 50%;
margin-top:-200px; //本身height的50%
margin-left: -200px; //本身width的50%
background-color: #cccccc;
}
3. 方法三
HTML
<div id="float-center"></div>
<div class="center-block">置中</div>
CSS
html, body {
margin:0; padding:0; height:100%;
}
.float-center {
float:left;
height:50%;
margin-bottom:-200px;
width:1px; /* only for IE7 */
}
.center-block {
clear:both;
height:400px;
position:relative;
background-color: #cccccc;
}
