一.自適應(yīng)寬度的水平居中
方法一
css :
.nav {
text-align: center;
}
.nav ul {
display: inline-block;
}
.nav li {
float: left;
margin: 10px;
list-style: none;
}
html :
<div class="nav">
<ul>
<li><a href="#">home</a></li>
<li><a href="#">news</a></li>
<li><a href="#">people</a></li>
<li><a href="#">about</a></li>
</ul>
</div>
效果圖 :
自適應(yīng)寬度的水平居中 1
從 css 代碼可以看出帜矾，在同時未設(shè)定父元素和子元素寬度的情況下床玻，即父子元素都自適應(yīng)寬度的情況下毁涉，要使子元素居中，可使用 text-align: center 和 display: inline-block 相結(jié)合的方式锈死。
方法二
** css :**
.nav {
display: table;
margin: 0 auto;
}
.nav li {
display: table-cell;
padding: 10px;
}
還是同樣的 html贫堰，效果圖如下：
自適應(yīng)寬度的水平居中 2
