DIV CSS 佈局教程網

18、如何解決IE下的3像素BUG?

參閱：http://blog.doyoe.com/article.ASP?id=68

19、DIV CSS設計中如何做1像素細邊框的table?

方法1：設置table的border-collapse:collapse;

<styletypestyletype="text/CSS"> 
table{border-collapse:collapse;border-color:#000;}  
td{border-color:#000;}  
</style> 
<tablecellspacingtablecellspacing="0"cellpadding="0"border="1"> 
<tr> 
<td>測試</td> 
<td>測試</td> 
</tr> 
</table> 

方法2：關鍵在於設置cellspacine="1"，用間隙來作為邊框

<styletypestyletype="text/CSS"> 
table{background:#000;}  
tr{background:#fff;}  
</style> 
<tablecellspacingtablecellspacing="1"cellpadding="0"border="0"> 
<tr> 
<td>測試</td> 
<td>測試</td> 
</tr> 
</table> 

20、以圖換字的幾種方法及優劣分析

以圖換字，其實是為了保證頁面的可讀性，這樣既有利於搜索引擎，又有利於結構查看。由於這種方式被大多數人所認同，所以方法也越來越多：

方法1：使用text-indent的負值，將內容移出容器；
方法2：使用display:none，將內容隱藏；
方法3：使用padding將文字擠出容器之外，並將超出的部分hidden;
方法4：使用font設置超小字體，達到隱藏內容的目的。

方法1（非常不推薦）看起來蠻簡單，但其實有幾個不理想的地方，1是比較吃資源；2是在IE5下面會出現滯後背景無法顯示；3是內容為超鏈接時，長長的黑色虛框，讓你抓狂。
方法2（不推薦）其實倒也不復雜，只是需要多添加一個標簽，比較浪費；且display:none出現的幾率太多，對SEO也是會有些許影響的。
方法3（推薦）StandardModel下要2層標簽才能搞定，不過相對方法1和2還是有優勢的，推薦一下。
方法4（強烈推薦）只需要將字體和行高設置為0，然後overflow:hidden就行;不過這樣在Safari和Chrome下還是會有1px高的字出現，所以應該再設置一下字體的顏色和背景圖相同或相近。以此就同樣可以達到隱藏內容的目的，暫時還沒發現有什麼副作用，強烈推薦。

21、DIV CSS設計中如何容器透明，內容不透明？

假設在標准模式下有如下結構：

<divclassdivclass="outer"> 
<pclasspclass="inner">我不要透明</p> 
</div> 

IEonly的方法：在父容器outer被設置為透明後，只需要將子容器inner設置為position:relative;如果需要兼容其它浏覽器，則以上的方法不適用，且結構也需改為：

<divclassdivclass="outer"></div> 
<divclassdivclass="inner">我不要透明</div> 

然後使用position+z-index搞定位置

22、DIV CSS設計中如何去掉鏈接的虛線框？

IE下：<ahref="#"onfocus="this.blur();"...>
FF下:a{outline:none;}

23、如何使得頁面字體行距始終保持n倍字體大小為基調？

在body內設置line-height:n即可，注，不可以為它加上單位
原因可參閱：http://blog.doyoe.com/article.ASP?id=195