在前端開發中,我們經常需要將網頁在不同的瀏覽器中進行測試。在使用IE8瀏覽器時,我們會發現一些CSS樣式無法實現,在此我們需要一些技巧,使IE8瀏覽器中的樣式生效。
/*重置IE8默認樣式*/ html{ overflow-y: scroll; } /*解決IE8偽元素不兼容問題*/ .element::before{ content: ""; display: inline-block; width: 0; height: 0; vertical-align: top; font-size: 0; line-height: 0; margin-top: -1em; } /*解決IE8不兼容opacity以及png透明問題*/ .opacity{ filter:alpha(opacity=80); opacity:0.8; } /*解決IE8瀏覽器中border-radius不兼容問題*/ .radius{ -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; behavior: url(/PIE.htc);//使用PIE.htc解決問題 }
以上是我在實際開發中經常使用的解決方案,通過這些技巧,我們可以在兼容性問題上更為得心應手。另外,在編寫CSS樣式時,也應格外注意代碼風格,養成良好的CSS習慣,方便日后維護。