DIV CSS 佈局教程網

本文和大家重點討論一下IE6.0下DIV不能實現1px高度的幾種解決方法，高度為1px的DIV在IE6裡不管用，因為IE6中的DIV默認有個最小字體高度，DIV的最小高度就是這個高度，即使設置了height:1px,DIV顯示出來的高度也不是1像素。

IE6.0下DIV不能實現1px高度的幾種解決方法

在設計網頁時，有時我們需要一個1px高度的細線，但IE6有個bug，高度為1px的DIV在IE6裡不管用。這是因為IE6中的DIV默認有個最小字體高度，DIV的最小高度就是這個高度，即使設置了height:1px,DIV顯示出來的高度也不是1像素。

解決方法有如下幾種：

◆1,網上都說多加一個font-size=0px；的屬性可以實現．

以下為引用的內容：

<styletypestyletype="text/CSS"> 
.a{  
font-size:0px;  
height:1px;  
background-color:red;  
}  
</style> 
<DIVclassDIVclass="a"></DIV> 
 

但經過我的測試，細是細了，但不是1px，有點像是2px.不知道是我的浏覽器問題，還是別的原因．你們可以用這個方法再測試一下．

◆2.多加一個line-height:1px的屬性，不過得在DIV裡多加一個 ，也就是空格，以下為引用的內容：

<styletypestyletype="text/CSS"> 
.a{  
width:200px;  
height:1px;line-height:1px;  
background:red;  
}  
</style> 
<DIVclassDIVclass="a">&nbsp;</DIV> 
 
 

這個方法我測試通過．很好用．如果你要做指定長度的細線，這個方法是個不錯的選擇．如果你的細線DIV長度是他父對象的長度的話，你可以用下面這個更簡單的方法：

◆3,用border-top:1pxsolid#ff0000邊框的方法制作一個細線.

以下為引用的內容：

<styletypestyletype="text/CSS"> 
.a{  
border-top:1pxsolid#ff0000;  
}  
</style> 
<DIVclassDIVclass="a"></DIV> 
 

注意:這個方法不能加width寬這個屬性.　加了以後他會有高度（雖然表面上看不到，他是透明的）要是你這個細線下面再有DIV的話，他的高度就看出來了.再多加上一個font-size:1px;可以解決這個問題．

【編輯推薦】

1. JavaScript巧解IE6至IE8兼容問題
2. 使用JavaScript輕松區別IE6、IE7、IE8
3. 剖析Margin和Padding屬性中四個值的先後順序及區別
4. 九步輕松解決IE6的各種疑難雜症
5. 技術前沿 一段JS代碼輕松解決IE6-IE8的兼容性問題