獲取文本在導航

Question

我想我的導航看起來像這樣的圖像下顯示：

<icon>  <icon>  <icon> 
Title  Longer Title Title 

理想情況下，我想我的代碼看起來像：

<li> 
    <img src="images/icon.png" /> 
    <a class="link_title">Title 1</a> 
</li> 
<li> 
    <img src="images/icon.png"/> 
    <a class="link_title">Title 2</a> 
</li> 
<li> 
    <img src="images/icon.png"/> 
    <a class="link_title">Title 3</a> 
</li> 

我已經擁有它水平，但不知道如何讓鏈接出現在圖標下方，而不使用我不想做的表格。 （讓我知道如果我必須，雖然）。

Answer 1

li { text-align:center; } 
li a.link_title { display:block; } 

此外，你與</span>關閉您的<a>標籤。這需要糾正：

<a class="link_title">Some Text</a> 

Answer 2

試試這個：

li { 
float:left; 
text-align:center; 
} 

li a { 
display:block; 
} 

li img { 
margin:0 auto; 
}