css3選擇器篇

2021-10-23 17:44:47 字數 2446 閱讀 6778

標籤選擇器:

陳業貴陳業貴

陳業貴陳業貴

核心;給html標籤設定相應的css屬性。(精確的)

id選擇器:

"identity1">1111

"identity2">1111

"identity3">1111

"identity4">1111

核心;唯一 (同一頁面內),

標籤命名規則:

/4.1id的名稱只能由字母/數字/下劃線

a-z 0-9 _

4.2id名稱不能以數字開頭

4.3id名稱不能是html標籤的名稱

不能是a h1 img input …/

在css中id標籤的顯示是:#。

類選擇器:

"pp">遲到毀一生

"ppp">早退窮三代

"pppp">按時上下班

"ppppp">必成高富帥

"para1 para2">我是段落

"para1 para2">我是段落

核心:類與id選擇器相反,是同一頁面可以重複,同時乙個標籤可以設定多個類名。並且·多個類名都可以有作用的哦。

id選擇器和class選擇器:

"colorr size30">第一段文字

"size30 line">第二段文字

"colorr line">第三段文字

核心:乙個標籤中可以設定多個類,可以的哦。

後代選擇器:

陳業貴"identity" class="para">

我是段落

核心:這裡面有優先順序的意思勒,id》類》標籤

後代選擇器的核心是找到選擇器名稱的最後哪乙個設定樣式,前面的是在**???

子元素選擇器:

我是段落

"identity">

我是段落

我是段落

我是段落

核心;找到選擇器最後的名稱設定樣式,這裡和後代選擇器相似。

記住,他只會查詢對應的標籤對應的子元素,不是孫子元素哈哈,記住哈.

具體還要看優先順序哈。

後代選擇器和子元素選擇器:

核心:其實兩者最大的的不同是後代是查詢包括子元素,孫子元素之類的。。。

而子元素只會查詢子元素,不會查詢孫子的哈。

交集選擇器:

我是段落

我是段落

"para1" id="identity">我是段落

"para1">我是段落

我是段落

核心是:必須是選擇器和選擇器之間沒有任何的連線符號。符合所有要求的才行啊。

並集選擇器:

"para">我是段落

我是段落

我是段落

核心:1.並集選擇器必須使用逗號來連線

2.選擇器可以使用標籤名稱/id名稱/class名稱

給所有選擇器選中的標籤設定屬性

兄弟選擇器:

"en">

"#">我是超連結

我是段落

我是段落

"#">我是超連結

我是段落

我是段落

我是段落

我是段落

核心:給指定選擇器後面緊跟的那個選擇器選中的標籤設定屬性(h1+p)。

(h1~p)是給指定選擇器的後面的所有選擇器設定屬性。

序選擇器:

"en">

我是段落1

我是段落2

我是段落3

我是段落4

我是段落5

我是段落6

我是段落7

我是段落8

"para">我是段落1

"para">我是段落2

"para">我是段落2

"en">我是專案

我是專案

我是專案

我是專案

我是專案

我是專案

我是專案

屬性選擇器:

"en">"identity1">我是段落1

"identity2" class="cc">我是段落2

"cc">我是段落3

"identity3" class="para">我是段落4

我是段落5

"en">

萬用字元選擇器:

我是段落

"#">我是超連結

CSS3 選擇器篇

如同人類的的進化一樣,css3是css2的進化版本,在css2基礎上,增強或新增了許多特性,彌補了css2的眾多不足之處,使得web開發變得更為高效和便捷 css當js用 js當後台語言用 瀏覽器支援程度差,需要新增私有字首 移動端 a webkit 谷歌 google b moz 火狐 firef...

CSS3 選擇器篇

想想我們之前用過的css 選擇器,有標籤選擇器,有類 class 選擇器,有id id 選擇器,有後代選擇器,有群組選擇器,還有基於以上延伸出來的選擇器,例如 div class 等這類混合行選擇器。css3新增了很多特性,圓角 邊框 背景 選擇器等 每乙個都拯救 web開發人員於水火之中,接下來,...

css3 選擇器 CSS3選擇器

子級選擇器用於選取帶有特定父元素的元素。書寫語法 element1 element2 注意 如果 element2 元素不是父元素 element1 的直接子元素,則不會被選擇。符號之前書寫父級的選擇器,符號之後寫子級選擇器,必須滿足父子級關係才選中標籤 相鄰兄弟選擇器可以用於選擇緊接在另乙個元素後...