1 2 CSS3課程入門之結構選擇

2022-03-14 09:45:32 字數 1527 閱讀 7403

e:nth-child(n)  表示e父元素中的第n個字節點

p:nth-child(odd)/*

匹配奇數行

*/p:nth-child(even)/*

匹配偶數行

*/p:nth-child(2n)e:nth-last-child(n) 表示e父元素中的第n個字節點,從後向前計算

e:nth-of-type(n) 表示e父元素中的第n個字節點,且型別為e

e:nth-last-of-type(n)表示e父元素中的第n個字節點,且型別為e,從後向前計算 【先理解nth-of-type(n)】

e:empty 表示e元素中沒有子節點。注意:子節點包含文字節點 ,例如

不能存在空格

e:first-child 表示e元素中的第乙個子節點

e:last-child 表示e元素中的最後乙個子節點

e:first-of-type 表示e父元素中的第乙個子節點且節點型別是e的

e:last-of-type 表示e父元素中的最後乙個子節點且節點型別是e的

e:only-child表示e元素的父元素只有乙個子節點。注意:子節點不包含文字節點,【

b:only-child】

e:only-of-type 表示e的父元素中只有乙個子節點,且這個唯一的子節點的型別必須是e。注意:子節點不包含文字節點【

123456

p *:only-of-type

/*父級下某型別的標籤僅有乙個時該唯一元素會被選中*/

>last-of-type與last-child區別

title

>

<

style

>

*body *:last-of-type

style

>

head

>

<

body

>

<

p>001

p>

<

h5>111

h5>

<

p>002

p>

<

p>003

p>

<

h5>222

h5>

<

p>004

p>

<

p>005

p>

body

>

html

>

1 3 CSS3課程入門之偽類和偽元素

e target 表示當前的url片段的元素型別,這個元素必須是e e disabled 表示不可點選的表單控制項 e enabled 表示可點選的表單控制項 e checked 表示已選中的checkbox或radio e after 生成內容在e元素後 e not s 表示e元素不被匹配 e f...

範仁義css3課程 14 顏色

設定color的值為transparent即可,例如color transparent用opacity屬性,屬性值在0.0到1.0範圍內,0表示透明,1表示不透明,比如 opacity 0.5 顏色值縮寫 關於顏色的css樣式也是可以縮寫的,當你設定的顏色是16進製制的色彩值時,如果每兩位的值相同,...

範仁義css3課程 38 偽元素選擇器

偽元素選擇器中的偽元素相當於dom中不存在的元素,僅僅是css中用來渲染,新增一些特殊效果的,比如p before,選擇p標籤 真元素 前面的假元素 偽元素,p標籤前面沒有元素,只是假設有 比如 before after first letter first line 1 before before...