CSS全面相容主流瀏覽器的寫法彙總

2022-02-12 09:01:35 字數 1907 閱讀 3045

指定檔案相容性模式

要為你的網頁指定檔案模式,需要在你的網頁中使用meta元素放入x-ua-compatible http-equiv 標頭。以下是指定為emulate ie7 mode 相容性之範例。

content goes here.

其內容隨著指定的頁面模式而更改,當要模擬ie7時,指定ie=emulateie7,指定ie=5, ie=7, 或ie=8來選擇其中一種相容性模式。你也可以指定ie=edge來指示ie8使用它支援的最高模式。

x-ua-compatible標頭沒有大小寫之分。然而除了title元素及其他的meta元素之外,它必須出現在網頁header節其它元素之前的位置。

下面的範例顯示該模式設定為其他值的狀況。

注意: 前面的範例顯示單獨的內容值。實際上ie只會執行網頁中第乙個x-ua-compatible標頭。

你也可以使用內容屬性來指定複數的檔案相容性模式,這能幫助確保你的網頁在未來的瀏覽器版本都能一致的顯示。欲設定複數的檔案模式,請設定內容屬性以判別你想使用的模式。使用分號來分開各個模式。

如果乙個特定版本的ie支援所要求的相容性模式多於一種,將採用列於標頭內容屬性中最高的可用模式。你可以使用這個特性來排除特定的相容性模式,雖然並不推薦這樣做。舉例來說,下列標頭即會排除ie7 mode。

background:#ffc; /*  對firefox有效*/

*background:#ccc; /* 對ie7有效 */

_background:#000; /* 只對ie6有效 */

firefox能解析第一段,後面的兩個因為前面加了特殊符號「*」和「_」,firefox認不了,所以只認background:#ffc,看到的是黃色;

ie7前兩段都能認,以最後的為準,所以最後解析是*background:#ccc,看到的是灰色;

ie6前三段都能認,而且「_」這個只有ie6能認,所以最後解析是_background:#000,看到的是黑色

ps:如果這樣寫還是有問題的話,請檢視一下你的html頭,看看之前的內容是不是這樣的標準寫法

">

">

css中 !important 這個屬性的用法:在css的使用中,遇到最多的問題就是不同瀏覽器之間的相容問題。 由於ie並不嚴格執行w3c標準, 而又幾乎壟斷了瀏覽器市場。 所以作為一名合格的**製作人員, 必須要針對不同的瀏覽器進行微調。 實現不同瀏覽器之間相容的方法有很多, 比如利用js探測使用者的瀏覽器型別,從而呼叫不同的樣式表。 或者就是利用!important 屬性來實現微調的效果。 下面是具體的例子。

下面是一段普通的 div **:

下面是有關層a在css樣式表中的定義, 注意,這裡使用了!important這個屬性。

#a 在上面的例子中, 層a 在ie瀏覽器中, 左邊距為20畫素, 而在firefox中, 左邊距則變為30畫素。 這是因為, !important在 css 中表示優先呼叫, 由於ie不能夠識別這個屬性, 所以在ie中, 只能夠呼叫 「margin-left:20px;" 這個選項, 所以同樣的一段**, 在firefox和ie中就會顯示不同的樣式。不過值得注意的是, 最新版的ie 7.0 已經可以識別 !important, 這個屬性了, 但是ie 6.0仍然不能識別。 所以這個小技巧還是相當有用的.

.e html* .e

*+html .e

* html .e

safari是可以解析 html* .e  這樣的寫法的,但是卻不能解析* html .e 這種寫法,所以。先寫html* .e 定好了safari下面的樣式,再寫一段*html .e來定好ie下的樣式就能達到相容的效果了。

在css布局中,還常常用到ie hack。if ie起著非常大的作用!

if ie什麼意思呢?下面就列舉了一些在css常見的hack控制語句。

除ie外都可識別

在css引入塊中用if 判斷瀏覽器載入不同的css:

歡迎跟貼補充!

瀏覽器相容的css寫法

1.ie6 ie7 ie8相容寫法 color ccc 只ie6支援 color ccc ie6 7支援 color ccc ie7支援 color ccc 0 0 ie8支援 color ccc 9 9 ie6 7 8支援 2.瀏覽器核心代表 ms transform rotate 7deg ms...

CSS瀏覽器字首相容寫法

vendor prefix 瀏覽器引擎字首,是一些放在css屬性前的小字串,用來確保這種屬性只在特定的瀏覽器渲染引擎下才能識別和生效。谷歌瀏覽器和safari瀏覽器使用的是 webkit 渲染引擎,火狐瀏覽器使用的是 gecko 引擎,internet explorer 使用的是 trident 引...

CSS瀏覽器字首相容寫法

css瀏覽器字首相容寫法 vendor prefix 瀏覽器引擎字首,是一些放在css屬性前的小字串,用來確保這種屬性只在特定的瀏覽器渲染引擎下才能識別和生效。瀏覽器引擎字首 vendor prefix 有哪些?moz 火狐等使用mozilla瀏覽器引擎的瀏覽器 webkit safari,谷歌瀏覽...