00 css中選擇器的複習

2021-08-19 20:41:18 字數 1129 閱讀 7758

div>p: 子代

div+p: div後面相鄰的第乙個p

div~p: div後面所有的兄弟p

屬性選擇器

id選擇器 # 通過id 來選擇

類名選擇器 . 通過類名來選擇

屬性選擇器 通過標籤屬性來選擇器

語法:

標誌性符號:

^:開頭

$:結尾 *:包含

e[title]  : 選中頁面的e元素,並且e需要帶有title屬性

e[title="abc"] :選中頁面的e元素,並且e需要帶有title屬性,屬性值為abc

e[title^="abc"] :選中頁面的e元素,並且e需要帶有title屬性,屬性值以abc開頭

e[title$="abc"] :選中頁面的e元素,並且e需要帶有title屬性,屬性值以abc結尾

e[title*="abc"] :選中頁面的e元素,並且e需要帶有title屬性,屬性值包含abc

結構偽類選擇器:

e:first-child 選中父元素中的第乙個子元素

e:last-child 選中父元素中的最後乙個子元素

e:nth-child(1) 選中父元素中的第5個子元素

n: 0,1,2,3,4。。。

偶數: 2n even

奇數:2n-1 odd

前5個: -n+5

e:nth-last-child(3): 從後向前選擇, 選中倒數第3個

div:nth-child(9)

注意:所選到的元素的型別 必須是指定的型別e,否則選擇無效;

e:empty 表示元素為空的狀態

e:target: 表示元素被啟用的狀態 要配合錨點使用

偽元素:

通過css模擬出html效果

e::before

e::after 必須有content 屬性

偽元素選擇器:

e::first-letter 選中第乙個字母

e::first-line選中第一行

e::selection: 表示選擇的區域 通過設定 color background

css中選擇器

選擇器描述 attribute 用於選取帶有指定屬性的元素。attribute value 用於選取帶有指定屬性和值的元素。attribute value 用於選取屬性值中包含指定詞彙的元素。attribute value 用於選取帶有以指定值開頭的屬性值的元素,該值必須是整個單詞。attribut...

CSS中選擇器介紹

一 號 選擇器,作用於所有標籤,用的比較少 二 標籤選擇器,通過標籤名 進行區分,一般和層級選擇器聯合使用 三 id選擇器,不允許重複使用,原則上只允許用在乙個標籤,用的比較少 四 類選擇器,乙個類可用於多個元素,乙個元素上也可以用多個類,可復用,最常用 五 層級選擇器,主要應用在選擇父類下的子元素...

CSS選擇器複習

通用選擇器 選擇到所有的元素 選擇子元素 選擇到元素的直接後代 第一級子元素 相鄰兄弟選擇器 選擇到緊隨目標元素後的第乙個元素 普通兄弟選擇器 選擇到緊隨其後的所有兄弟元素 偽類選擇器 before,after在元素內容前面 後面新增內容 相當於行內元素 css3結構選擇器 nth child 選擇...