|
|
|
| |
 |
當前位置：首頁 >
建站常識 |
| |
 | |
|
| |
DIV+CSS之讓ul及li水平居中顯示 |
| 來源:桂林網站優化 發布時間: 2010/5/9 18:47:03 點擊率: 4978 次 |
想搞一個正規一點的，上檔次一點的網站建設公司網站，然后其中有個導航需要用到水平居中。一直以為對ul li居中對齊已經掌握了。但近做項目時發現之前li的float:left方法顯然有一個問題，就是無法居中（水平），只能使用padding-left或margin-right的方法方法來固定其居中。但這樣可能在寬屏與窄屏的顯示不一致。使用這種方法主要是利用li的浮動固定寬度來實現，li的默認display為block，將其這個屬性改為inline便可實現這種ul li居中的問題。因為現在的網站大多都使用DIV布局，這種類型的網站也適合桂林網站優化來做搜索引擎的關鍵詞排名了，所以希望大家也能注意。網上GOOGLE了一下讓UL或LI水平居中顯示的代碼，現在將未知寬度讓LI水平居中代碼共享CSS如下：
#linknav{height:140px;}
#linknav ul{text-align:center;list-style-type:none;}
#linknav ul li{display:inline;list-style-type:none;}
DIV結構代碼如下：
<div id="linknav">
<ul>
<li><a href="#">關于我們</a></li>
<li><a href="#">域名注冊</a></li>
<li><a href="#">虛擬主機</a></li>
<li><a href="#">企業郵局</a></li>
<li><a href="#">網站優化</a></li>
<li><a href="#">網站推廣</a></li>
</ul>
</div>
若你還有更好的辦法，更簡潔的代碼請與我們聯系 |
|
|
