DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> WEB前端代碼 >> 去掉ie6下li之間多出的間隔
去掉ie6下li之間多出的間隔
編輯:WEB前端代碼     
ie6下li之間多出間隔的原因和解決辦法:
ie6下,當<li>標簽中的內容是一個<a>元素並且a標簽或a標簽裡面的子元素如:<img/>標簽設置了“display:block”,此時ie6浏覽器中,將不會忽略列表標簽li之間的空格,表現為顯示成額外的一行夾在<li>標簽之間。

問題代碼:

li a{display:block;background:#f00;}

<ul><li><a href="#">測試</a></li><li><a href="#">測試</a></li><li><a href="#">測試</a></li></ul> 建站資源

解決辦法:

方法一:(推薦)

避免將li標簽裡面的a元素或a元素裡面的子元素設成display:block,將對應樣式加在li標簽裡面。

方法二:(推薦)

觸發a標簽或a標簽子元素的haslayout,如給a加下面屬性:

li a{*height:1%;}

當然刪除<ul></ul>標簽對內的所有空格也能解決這個問題,但這樣會降低代碼的可讀性,故不推薦這種處理方法
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved