w3cshool 筆記
1. 派生選擇器
比如:li strong
#green
下面的 html **中,id 屬性為 red 的 p 元素顯示為紅色,而 id 屬性為 green 的 p 元素顯示為綠色。
這個段落是紅色。
這個段落是綠色。
注意:id 屬性只能在每個 html 文件中出現一次
3. id 選擇器和派生選擇器
在現代布局中,id 選擇器常常用於建立派生選擇器。
#sidebar p
在上面的例子中,所有擁有 center 類的 html 元素均為居中。
在下面的 html **中,h1 和 p 元素都有 center 類。這意味著兩者都將遵守 ".center" 選擇器中的規則。
8.class 派生選擇器:
.fancy td
親自試一試
例子 2
與上面類似,可以只對有 href 屬性的錨(a 元素)應用樣式:
a[href]
還可以根據多個屬性進行選擇,只需將屬性選擇器鏈結在一起即可。
a[href][title]
11.屬性和值選擇器
下面的例子為 title="w3school" 的所有元素設定樣式:
w3school
12.屬性和值選擇器 - 多個值
下面的例子為包含指定值的 title 屬性的所有元素設定樣式。適用於由空格分隔的屬性值:
hello w3school students!
hello w3school students!
下面的例子為帶有包含指定值的 lang 屬性的所有元素設定樣式。適用於由連字元分隔的屬性值:
hello!
hi!
hi!hao!
13.css 元素選擇器
最常見的 css 選擇器是元素選擇器。換句話說,文件的元素就是最基本的選擇器。
如果設定 html 的樣式,選擇器通常將是某個 html 元素,比如 p、h1、em、a,甚至可以是 html 本身:
html
h1 h2
14. 選擇器分組
假設希望 h2 元素和段落都有灰色。為達到這個目的,最容易的做法是使用以下宣告:
h2, p
將 h2 和 p 選擇器放在規則左邊,然後用逗號分隔,就定義了乙個規則。其右邊的樣式(color:gray;)將應用到這兩個選擇器所引用的元素。逗號告訴瀏覽器,規則中包含兩個不同的選擇器。如果沒有這個逗號,那麼規則的含義將完全不同。參見後代選擇器。
可以將任意多個選擇器分組在一起,對此沒有任何限制。
例如,如果您想把很多元素顯示為灰色,可以使用類似如下的規則:
body, h2, p, table, th, td, pre, strong, em
15.萬用字元選擇器
css2 引入了一種新的簡單選擇器 - 通配選擇器(universal selector),顯示為乙個星號(*)。該選擇器可以與任何元素匹配,就像是乙個萬用字元。
例如,下面的規則可以使文件中的每個元素都為紅色:
* 16.選擇子元素
選擇子元素
如果您不希望選擇任意的後代元素,而是希望縮小範圍,只選擇某個元素的子元素,請使用子元素選擇器(child selector)。
例如,如果您希望選擇只作為 h1 元素子元素的 strong 元素,可以這樣寫:
h1 > strong
這個規則會把第乙個 h1 下面的兩個 strong 元素變為紅色,但是第二個 h1 中的 strong 不受影響:
17.選擇相鄰兄弟
相鄰兄弟選擇器(adjacent sibling selector)可選擇緊接在另一元素後的元素,且二者有相同父元素。
選擇相鄰兄弟
如果需要選擇緊接在另乙個元素後的元素,而且二者有相同的父元素,可以使用相鄰兄弟選擇器(adjacent sibling selector)。
例如,如果要增加緊接在 h1 元素後出現的段落的上邊距,可以這樣寫:
h1 + p
這個選擇器讀作:「選擇緊接在 h1 元素後出現的段落,h1 和 p 元素擁有共同的父元素」。
結合其他選擇器
相鄰兄弟結合符還可以結合其他結合符:
html > body table + ul
這個選擇器解釋為:選擇緊接在 table 元素後出現的所有兄弟 ul 元素,該 table 元素包含在乙個 body 元素中,body 元素本身是 html 元素的子元素。
CSS3 0學習筆記(W3C) 上
css3 被劃分為模組。其中最重要的 css3 模組包括 在本章中,您將學到以下邊框屬性 div div 引數分別為 陰影的x軸位移,y軸位移,羽化程度,顏色 在這裡,鋪滿整個邊框。在這裡,被拉伸以填充該區域。這是我們使用的 注釋 internet explorer 不支援 border image...
css3 選擇器 CSS3選擇器
子級選擇器用於選取帶有特定父元素的元素。書寫語法 element1 element2 注意 如果 element2 元素不是父元素 element1 的直接子元素,則不會被選擇。符號之前書寫父級的選擇器,符號之後寫子級選擇器,必須滿足父子級關係才選中標籤 相鄰兄弟選擇器可以用於選擇緊接在另乙個元素後...
W3C是什麼意思 W3C標準簡介
什麼是w3c w3c是英文 world wide web consortium 的縮寫,中文意思是w3c理事會或全球資訊網聯盟。w3c組織是對網路標準制定的乙個非贏利組織,像html xhtml css xml的標準就是由w3c來定製。w3c的主要規範 到目前為止,w3c已開發了超過50個規範 草案...