相容IE6 IE7 IE8 FF的CSS寫法

2021-06-16 04:25:12 字數 1202 閱讀 5171

注意:

*+html 對ie7的hack 必須保證html頂部有如下宣告:

二、萬能 float 閉合(非常重要!)

關於 clear float 的原理可參見 [how to clear floats without structural markup]

將以下**加入global css 中,給需要閉合的div加上 >

關於閉合浮動元素(clearing float)的方法現在已經很多了,個人認為簡單實用的方法就是使用:after偽類動態的嵌入乙個用於清除浮動的元素,可惜**量太大了,看上去不夠簡潔。

現在看到有個方法超級簡單。介紹一下這個方法。原文在:

這一方面的原理是,外圍元素之所以不能很好的延伸,問題出在了overflow上,因為overflow不可見(見w3c的解釋)。現在只要將給外圍元素新增乙個「overflow:auto」,就可以解決問題,結果是除了ie,真的可以解決。下來就要解決id的問題了,再加上 「_height:1%」,這個問題就完全解決了。

下面的例子作為比較

1、沒有閉合浮動元素;2、非ie下閉合浮動元素;3、完全閉合元素。相關**如下:

xhtml**:

example source code [ww

w.52css.com]

9 屬性選擇器(這個不能算是相容,是隱藏css的乙個bug)

p[id]{}div[id]{}

這個對於ie6.0和ie6.0以下的版本都隱藏,ff和opera作用

屬性選擇器和子選擇器還是有區別的,子選擇器的範圍從形式來說縮小了,屬性選擇器的範圍比較大,如p[id]中,所有p標籤中有id的都是同樣式的.

10 ie捉迷藏的問題

當div應用複雜的時候每個欄中又有一些鏈結,div等這個時候容易發生捉迷藏的問題。

有些內容顯示不出來,當滑鼠選擇這個區域是發現內容確實在頁面。

解決辦法:對#layout使用line-height屬性 或者給#layout使用固定高和寬。頁面結構盡量簡單。

11 高度不適應

高度不適應是當內層物件的高度發生變化時外層高度不能自動進行調節,特別是當內層物件使用

margin 或paddign 時。

例: p物件中的內容

css:#box

#box p

解決方法:在p物件上下各加2個空的div物件css**:.1或者為div加上border屬性。

IE6 IE7 IE8 FF相容符號

2.區別ie8 ie9 一般來說,我們寫的結構比較好的時候,ie8 9下是沒區別的.所以可能很少人關注只有ie8或只有ie9才識別的css hack.因為ie8及以下版本是不支援css3的,但是我們如果使用css3,在ie下ie9正常渲染,但我們又想讓ie8及以下的瀏覽器實現同樣的效果,且不希望使用...

IE6 IE7 IE8 IE9 FF相容性除錯

hack原理 不同瀏覽器對各中字元的識別不同 讀完文章你會發現,ff和ie8對以下字元的識別能力完全相同 在 css中常用特殊字元識別表 1 ie6 ie7都能識別 而標準瀏覽器ff ie8是不能識別 的 2 important 除ie6不能識別 important外,ff ie8 ie7都能識別 ...

CSS相容IE6,IE7,FF的技巧

以下兩種方法幾乎能解決現今所有hack.1,important 隨著ie7對 important的支援,important 方法現在只針對ie6的hack.注意寫法.記得該宣告位置需要提前.注意 html 對ie7的hack 必須保證html頂部有如下宣告 關於 clear float 的原理可參見...