DIV和CSS排版中制作細(xì)線條的方法小結(jié)
更新時間：2007年09月09日 21:43:50 作者：
今天制作div的高度控制的時候發(fā)現(xiàn)IE下控制div的高度很小的時候無效，特意查了一下相關(guān)文章。
最終有了解決方案，參考下面文章：
如果要制作一條高度小于12PX（大約）的線條，在IE中會顯示出高于實(shí)際高度的，看下面。
<style>
.line{
background: #CCCCCC;
height: 6px;
}</style>
<div class="line"></div>
可看出實(shí)際高度大于6PX，這也算是IE的一個BUG吧。以下三種方法可解決這個問題，推薦使用第一種方法。
1：
<style>
.line11{
background: #CCCCCC;
height: 6px;
overflow: hidden;
}</style>
<div class="line11"></div>
2. div之間要加個空格 注：IE5.0 無效
<style>
.line12{
background: #336699;
line-height: 6px;
}</style>
<div class="line12"> </div>
3：
<style>
.line13{
background: #CC0000;
height: 6px;
font-size: 1px;
}</style>
<div class="line13"></div>
最終有了解決方案，參考下面文章：
如果要制作一條高度小于12PX（大約）的線條，在IE中會顯示出高于實(shí)際高度的，看下面。
復(fù)制代碼 代碼如下:
<style>
.line{
background: #CCCCCC;
height: 6px;
}</style>
<div class="line"></div>
可看出實(shí)際高度大于6PX，這也算是IE的一個BUG吧。以下三種方法可解決這個問題，推薦使用第一種方法。
1：
復(fù)制代碼 代碼如下:
<style>
.line11{
background: #CCCCCC;
height: 6px;
overflow: hidden;
}</style>
<div class="line11"></div>
2. div之間要加個空格 注：IE5.0 無效
復(fù)制代碼 代碼如下:
<style>
.line12{
background: #336699;
line-height: 6px;
}</style>
<div class="line12"> </div>
3：
復(fù)制代碼 代碼如下:
<style>
.line13{
background: #CC0000;
height: 6px;
font-size: 1px;
}</style>
<div class="line13"></div>
相關(guān)文章
Css Reset是什么? 有些同行叫 "css復(fù)位",有些可能叫 "默認(rèn)css".....2008-09-09
css條件注釋理論及實(shí)踐源文件...2007-03-03
很早以前的關(guān)于表格的高級使用技巧，建議學(xué)習(xí)，并不是一定都要用div+css布局的，很適合現(xiàn)在2008-05-05
看好的站長都是很愛國的，捐款，網(wǎng)頁統(tǒng)一成黑白色2008-05-05
CSS 使用Sprites技術(shù)實(shí)現(xiàn)圓角效果
使用CSS Sprites技術(shù)畫圓角，簡單的講就是把一個圓做在一張圖上，定義4個div，每個div取圖的一個角做背景，下面看具體實(shí)現(xiàn)方法。2016-04-04![css圖片切換效果代碼[不用js]](http://img.jbzj.com/images/xgimg/bcimg5.png)
非常不錯的圖片切換效果代碼，不用css，代碼比較精簡，推薦使用，注意一下多瀏覽器的兼容性2008-09-09
一個針對IE7的CSS Hack...2007-01-01
css有序列表實(shí)現(xiàn)方法與html標(biāo)簽說明2008-07-07
比較經(jīng)典的分頁樣式代碼，主要是多數(shù)字分頁2008-06-06
htm頁面中<a name>加name和id的沖突附解決方法
原來在<a name="jb51"> 和<span id="jb51">是沖突的，唉弄了好一會，郁悶 臨時解決方法就是在后面的id中加了一個2，就是<span id="jb512">2008-07-07