CSS實戰中經常出現的問題。


如果你把這些當做文章來看,那你始終是學不會,而是應該當做手冊來看,這些也是自己在寫網站遇到的問題。轉載請出處。

追夢子前端博客。

1. logo添加內容給h1設置text-index:-9999px的時候會把里面的其他標簽也給定位過去。
解決方法:如果要添加內容,那么圖片用背景來做。

 

2. button高度問題
button在高度計算上始終使用了Quirks模式。在Quirks模式下,邊框的計算是在元素的寬度內的,而不像標准模式一樣計算在外部,所以在text和button上同時設置邊框就會得到button的高度比text小的現象。所以文本框要與button按鈕對齊,button的高度是要高於文本text的高度的。(button的高度包含邊框的高度,而文本框text則不包含邊框高度。)

 

3. opacity透明度問題
如果父元素使用了opacity那么子元素也會被透明,如果不想讓子元素透明,那么就弄一個空的元素,給這個空的元素設置opacity而不是給父元素。如果即要加背景圖片又要加透明度,那么需要添加兩個元素,一個加背景,一個加圖片。

 

4. 在IE7中input為submit時如果有邊框會出現一條黑色的邊框,解決方法,在input外面套一層標簽,然后給外面的那一層添加邊框。

 

5. ie低版本按鈕單擊以后出現虛線,通過outline:0,去除。

 

6. z-index問題
如果出現覆蓋不了的問題,那么可以通過給想要覆蓋的元素添加背景顏色。

 

7. a標簽中使用img后的高度多出幾像素解決方法
這個主要是因為img是行內元素,它的下邊緣默認是與基線對齊的,將img標簽display設置成block

 

8. 當父元素沒有設置高的時候,如果發現子元素沒有被父元素包含,那么可以通過overflow:hidden來解決。

 

9. 一旦出現問題的時候,盡快解決,如果是要將代碼重用,一定要考慮后面的代碼。

 

10. 模塊化CSS代碼,把公共的元素取單獨的class,好抽離。

 

11. 在css中沒有colspan,單元格合並,需要在html中直接設置。

 

12. 浮動的元素,父元素的高不會被撐開。解決:清除浮動。


注意!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系我们删除。



 
粤ICP备14056181号  © 2014-2021 ITdaan.com