一、偽元素:
使用偽元素來表示元素中的一些特殊位置
常用:1、:first-letter 為元素中的第乙個位置設定樣式
2、:first-line 為元素中的第一行位置設定樣式
3、:before 為元素最前邊的部分設定樣式(一般before都需要結合屬性content樣式一起使用
通過content可以向before或after位置新增一些內容)
語法:p:before
4、:after 最後邊部分設定樣式
語法:p:after
二、屬性選擇器
1、title屬性:1、這個屬性可以給任何標籤指定
當滑鼠移入到元素上時元素中title屬性的值將會作為提示文字顯示
我是乙個段落
2、為所有具有title屬性的元素設定樣式:
2、常用屬性選擇器的語法: [屬性名] 選取含有指定屬性的元素
[屬性名=「值」] 選取含有指定屬性值的元素
[屬性名^=「屬性值」] 選取這個值以指定值開頭的元素
例如:p[title^=「abc」] 選取以abc開頭的title元素
[屬性名$=「屬性值」]選取這個值以指定屬性值結尾的元素
[屬性名*=「屬性值」]選取屬性值以包含指定內容的元素
三、其他子元素選擇器
1、:first-child 選擇第乙個子標籤
2、:last-child 選中最後乙個子標籤
3、:nth-child(引數) 選中指定位置的子元素,該選擇器後邊可以指定乙個引數,
指定要選中第幾個元素,引數even表示偶數字置改變樣式,引數odd表示奇數字置改變樣式
(例如:選中p中的第三個元素
p:nth-child(3){} )
偶數變化:p:nth-child(even){}
奇數變化:p:nth-child(odd){}
4、:first-of-type 選擇指定型別的子元素()
:last-of-type 選擇指定型別的子元素
:nth-of-type 選擇指定型別的子元素
四、兄弟元素選擇器
1、後乙個兄弟元素選擇器:
作用:可以選中乙個元素後緊挨著的指定的兄弟元素
語法:前乙個+後乙個(要緊挨著的後乙個,中間不能隔開)
例如:span + p {}
2、選中後邊的所有兄弟元素
語法:前乙個 ~ 後乙個{}
屬性選擇器 子元素的偽類 兄弟元素選擇器
charset utf 8 title 屬性選擇器 作用 可以根據元素中的屬性值來選取指定元素 語法 屬性名 選取含有指定屬性的元素 例 p title 語法 屬性名 屬性值 選取含有指定屬性的元素 p title hello 語法 屬性名 屬性值 選取以指定內容開頭的元素 p title a 語法...
屬性選擇器,偽類選擇器,偽元素選擇器
屬性選擇器 1doctype html 2 html lang en 3 head 4 meta charset utf 8 5 title 屬性選擇器 title 6 style 7 屬性匹配 8 label for 12 屬性名匹配 13 label for pwd 17 以什麼結尾匹配 18 ...
屬性選擇器,子元素選擇器,偽元素選擇器筆記
屬性選擇器 屬性名稱 屬性名稱 屬性值 子元素選擇器 第n個子元素 元素 nth child 1 最後乙個子元素 元素 last child 全部子元素 test test2 直接子元素 test test2 選擇後面的乙個元素 test div 選擇後面的多個元素 test div偽元素 通過cs...