要点:去掉LI的float:left的属性。
 
li的float:left方法显然有一个问题,就是无法居中(水平),只能使用padding-left或margin-right的方法方法来固定其居中。

一直以为对ul li居中对齐已经掌握了。但最近做项目时发现之前li的float:left方法显然有一个问题,就是无法居中(水平),只能使用padding-left或margin-right的方法方法来固定其居中。但这样可能在宽屏与窄屏的显示不一致。
使用这种方法主要是利用li的浮动固定宽度来实现,li的默认display为block,将其这个属性改为inline便可实现这种ul li居中的问题

<style type="text/css">
#bNav{
margin-top:10px;
background:#D9EBF5;
text-align:center;
}
#bNav ul{
padding:4px 0;
margin:0;
overflow:hidden;
}
#bNav ul li{
display:inline;
padding:0;
}
</style>

<div >Apply Link</a></li>
 </ul>
</div>

相关文章: