沒有「位置：絕對」的設置li的高度

Question

我想製作一個有背景的li元素的菜單，所以我想設置height和width，但我不能那樣做。我嘗試了position: absolute;，但是當我這樣做時，列表項就會彼此重疊。

有沒有方法來改變高度/寬度沒有position: absolute;？

我從來沒有遇到過這個問題，我不知道它是什麼，我希望你能幫上忙。 在此先感謝。

Answer 1

你可以嘗試調整line-height或使用display: block togheter與width和height：

<ul class="one"> 
    <li>One</li> 
    <li>Two</li> 
</ul> 

<ul class="two"> 
    <li>One</li> 
    <li>Two</li> 
</ul> 

.one li { 
    line-height: 2em; 
    background-color: green; 
} 

.two li { 
    display: block; 
    background-color: pink; 
    width: 50px; 
    height: 50px; 
} 

http://jsfiddle.net/PJvq4/

Answer 2

Li元素是默認爲顯示：列表項，而忽略高度。 高度和寬度是對顯示塊和內嵌塊或浮動元素有效的css屬性。

在你的情況下，如果你想要一個帶有固定高度的元素的垂直列表去顯示：塊，因爲它意味着換行符。

希望能夠幫助