復制代碼代碼如下:
li {width:300px; height:23px; line-height:24px:}
<ul>
<li>行距很大</li>
<li>行距很大</li>
<li>行距很大</li>
<ul>
以上定義後li的行間距應該是23px,但是IE確是28px,多了5個像素,原因不知道,解決方法如下(紅色表示測試OK):
1.解決li在IE5下產生空白行距的方法:如果li定義了寬度,那麼需要在li裡面再定義vertical-align: bottom;。
2.寬度最好不要定義在UL,定義在LI或者UL外層的DIV裡面。
3.書寫LI的最佳方式,li裡面要書寫高度和寬度,以及vertical-align: bottom;(for ie5/win bug),或者在ul外面加上一層div,並定義寬度,那麼在li裡面不用定義寬度和vertical-align: bottom;,也顯示正常(IE5下不會產生空白行距),不過高度還是要定義一下的。