2012-02-27 31 views
0

我解決了CSS問題。我有一個情況如下將DIV標籤中的UL圖像居中

<div> 
<ul> 
<li> <img src="a.jpg" ></li> 
<li> <img src="a.jpg" ></li> 
<li> <img src="a.jpg" ></li> 
<li> <img src="a.jpg" ></li> 
</ul> 
</div> 

我想中心我所有的UL標記,但圖像必須要左對齊。

當我使用text-align:center時,我將圖像作爲中心。但是,ul中的最後圖像顯示在我不想顯示的中心。

任何人都可以幫助我嗎? 在此先感謝。

回答

0

這樣寫:

div{text-align:center} 
ul{ 
display:inline-block; 
*display:inline;/* for IE7 */ 
*zoom:1; 
text-align:left; 
} 
+0

我認爲第二個選擇應該是'UL li' – 2012-02-27 10:59:40

0

嘗試這樣的事情

HTML

<div id="menu"> 
    <ul> 
    <li><span></span><a href="">Add Some Text</a></li> 
    <li><span></span><a href="">Add Some Text</a></li> 
    <li><span></span><a href="">Add Some Text</a></li> 
    <li><span></span><a href="">Add Some Text</a></li> 
    <li><span></span><a href="">Add Some Text</a></li> 
    </ul> 
</div> 

CSS

#menu li { 
clear: left; 
} 

#menu li a { 
padding: 5px 0 0 40px; 
display:block; 
} 

#menu li span { 
float: left; 
display: block; 
height: 32px; 
width:32px; 
background: url(images/icon.png) no-repeat; 
} 

使用span標籤則有調用圖標圖像控制 在你的文本和圖標圖像通過你的CSS是要走的路。當然,你可以刪除文本

這裏的例子http://jsfiddle.net/DUjfd/