css padding屬性兼容ie6,ie8,firefox實例詳解

2024-07-11 08:49:04

字體：大中小

來源：轉載

供稿：網(wǎng)友

本文章簡單的介紹一下關于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
設現(xiàn)在設置一個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

上一篇：css選擇器(selector) xPath的選擇器

下一篇：div css布局解決瀏覽器兼容及優(yōu)化等實用技巧