本文章簡單的介紹一下關于padding兼容ie6,ie8,firefox的做法,因為不同瀏覽器對padding理解不一樣,所以在瀏覽時會有點差別。
padding 簡寫屬性在一個聲明中設置所有內邊距屬性。
說明
這個簡寫屬性設置元素所有內邊距的寬度,或者設置各邊上內邊距的寬度。行內非替換元素上設置的內邊距不會影響行高計算;因此,如果一個元素既有內邊距又有背景,從視覺上看可能會延伸到其他行,有可能還會與其他內容重疊。元素的背景會延伸穿過內邊距。不允許指定負邊距值。
注釋:不允許使用負值。
例子 1
padding:10px 5px 15px 20px;上內邊距是 10px
右內邊距是 5px
下內邊距是 15px
左內邊距是 20px
例子 2
padding:10px 5px 15px;上內邊距是 10px
右內邊距和左內邊距是 5px
下內邊距是 15px
例子 3
padding:10px 5px;上內邊距和下內邊距是 10px
右內邊距和左內邊距是 5px
例子 4
padding:10px;所有 4 個內邊距都是 10px
設現在設置一個padding值,這個值在FF、IE8、IE6中都不一樣
首先考慮的是FF下的值
.test{padding:10px}
接著考慮IE8下的值
.test{padding:10px;*padding:9px}
最后考慮IE6下的值
.test{padding:10px;*padding:9px;_padding:8px}
這樣就可以了。
做兼容性時,最先考慮FF、opera這些瀏覽器,最后考慮IE6。
拿上例來說,IE8、IE6都可識別*,但FF不能識別。
所以拿*來做IE8的Hack,而_在FF和IE8中都不識別,只有IE6能識別,所以用_做IE6的Hack
新聞熱點
疑難解答