柳絮紛飛的日子 CSS筆記之四

2021-06-05 19:57:56 字數 1403 閱讀 2000

1.ie6也認識!important.我們知道!important一般用做提公升優先順序,區分ie6和firefox/chrome/opera/ie 其他版本的hack,不過並不是因為ie6完全不支援!important.

**段一:

**段一

**段二:

**段二

**段一ie6下的字型顏色為綠色,在其他瀏覽器下是藍色。**段二在ie和ff/chrome/opera下均為藍色。firefox下,**段一的字型顏色為藍色,**二的顏色為綠色。得出結論:css中,兩個同樣的屬性,其一attribute:value !important;定義在前,其二attribute:value;定義在後, 如果二者被定義在同乙個花括號內,則ie6是後面的樣式覆蓋前面的樣式,ie6之外的別的瀏覽器則因為優先權的提公升顯示為前者的樣式;如果二者定義在(指的是同一類或id名下)不同的花括號,則此時ie6下!important生效。這樣,所有的瀏覽器都會顯示前者attribute:value !important的樣式效果。

2.多類選擇符

類似於.class1   .class2這樣用空格分隔的層次選擇器,大家都很熟悉,匹配的是類class1的後代類class2。而對於無空格分隔的多類相連的寫法,有些看法說需要根據瀏覽器區別對待,有人說這樣的多類選擇符ie6是不支援的。而我自己的測試表明,ie6也是支援這樣的寫法的。eric meyer《css權威指南》書中說,ie對多類選擇符不支援並不正確,至少對ie6而言,並非如此。.warning.urgent 有效,並非無效。

3.ie6.0對css2.1選擇符的支援並不完整。

下面是ie不支援或者支援上存在問題的地方:

1)子選擇符。

child selector

h1 > strong 無效,只能使用 h1 strong ,不支援子選擇符,但支援派生選擇符。

2)相鄰兄弟選擇符。

sibling selector

li+li 無效。

3)屬性選擇符。

attribute selector

h1[class] 無效。

4)偽類選擇符

pseudo-class selector有限支援。

:first-child偽類

語言偽類

:before和:after偽類

偽類:hover只在a元素中起作用

不支援偽類:focus。對於a元素獲得焦點時使用:active

a:link :visited ,只認最後乙個:visited.

最好按如下順序寫:

a:link

a:visited

a:hover

a:active

ie6對偽類選擇符支援,也僅限於超鏈。

CSS筆記四 CSS的繼承 層疊和特殊性

一 繼承 css的某些樣式是具有繼承性的,那麼什麼是繼承呢?繼承是一種規則,它允許樣式不僅應用於某個特定html標籤元素,而且應用於其後代。比如下面 如某種顏色應用於p標籤,這個顏色設定不僅應用p標籤,還應用於p標籤中的所有子元素文字,這裡子元素為span標籤。p 三年級時,我還是乙個膽小如鼠spa...

XML學習筆記(四) 修飾XML文件的CSS

標籤 空格分隔 學習筆記 xml為儲存結構化資料提供了強大的方法,但是它沒有提供關於資料如何顯示地資訊,資料的結構與資料表示無關 可以使用css來控制xml文件中各元素的呈現方式。又三部分構成 選擇器 selector 屬性 property 屬性值 value 基本語法個數如下 selector雖...

CSS之應用樣式的四種方式

通過link標籤鏈結的樣式表不是html文件的一部分,但是卻供文件使用。這樣的樣式表稱為外部樣式表。web瀏覽器遇到link標籤時,會查詢並載入樣式表,並渲染html文件。屬性比如 此時由於文件中關聯的兩個外部樣式表的rel均為stylesheet,因此顯示文件時會合併兩個樣式表中的規則後再應用於文...