CSS ul li居中本來以為很容易就實現了，因為平時都是讓li float:left，這樣後面的可以排成一行，對居中沒做要求，不過最近搞個項目，必須讓ui的每個li都居中顯示，這可讓我難為了，沒想到一時把我難壞了，不過還是被我解決了。下面說下方法：
我的方法主要是利用li的浮動固定寬度來實現，li的默認display為block，將這個屬性改為inline就可以讓ul li居中，簡單吧！下面來段代碼實例：
01
<style type="text/CSS">
02
#bNav{
03
margin-top:10px;
04
background:#D9EBF5;
05
text-align:center;
06
}
07
#bNav ul{
08
padding:4px 0;
09
margin:0;
10
overflow:hidden;
11
}
12
#bNav ul li{
13
display:inline;
14
padding:0;
15
}
16
</style>
17
<div id="bNav" class="bNav">
18
<ul>
19
<li><a href="#" title="Home">公司主頁</a></li>
20
<li>|</li>
21
<li><a href="#" title="About Us">About Us</a></li>
22
<li>|</li>
23
<li><a href="#" title="形象設計">形象設計</a></li>
24
<li>|</li>
25
<li><a href="#" title="藝術天地">藝術天地</a></li>
26
<li>|</li>
27
<li><a href="#" title="Contact Us">Contact Us</a></li>
28
<li>|</li>
29
<li><a href="#" title="應用開發">應用開發</a></li>
30
<li>|</li>
31
<li><a href="#" title="工作服務">工作服務</a></li>
32
<li>|</li>
33
<li><a href="#" title="申請鏈接">申請鏈接</a></li>
34
</ul>
35
</div>
呵呵，由此你可以做成一款菜單了。