CSS 選擇器 選擇前幾個元素

2022-09-04 19:39:10 字數 765 閱讀 3957

方法:使用偽類選擇器處理

1、選擇第n個,n代表數字

:nth-child(n)

2、選擇列表中的偶數的標籤

:nth-child(2n){}

:nth-child(even)

3、選擇列表中的奇數的標籤

:nth-child(2n - 1)

:nth-child(odd)

4、【負方向範圍】選擇第1個到第3個

:nth-child(-n + 3)

5、【正方向範圍】選擇從第3個開始的,直到最後

:nth-child(n + 3)

6、【限制範圍】選擇第3個到第6個,取兩者的交集

:nth-child(-n+6):nth-child(n+3)

7、選擇列表中的倒數第n個標籤 n為數字

:nth-last-child(n)

8、選擇第乙個 ( first-child表示選擇列表中的第乙個標籤 )

:first-child

9、選擇最後乙個 ( last-child表示選擇列表中的最後乙個標籤 )

:last-child

CSS選擇器 偽元素選擇器

css選擇器 偽元素選擇器 偽元素以 開頭,用在選擇器後,用於選擇指定的元素。after選中之後的不存在的節點,可配合content屬性進行內容填充 section h3 after before選中之前的不存在的節點,可配合content屬性進行內容填充 section h3 before fir...

CSS 元素選擇器

最常見的 css 選擇器是元素選擇器。換句話說,文件的元素就是最基本的選擇器。如果設定 html 的樣式,選擇器通常將是某個 html 元素,比如 p h1 em a,甚至可以是 html 本身 html h1 h2親自試一試 可以將某個樣式從乙個元素切換到另乙個元素。假設您決定將上面的段落文字 而...

css 元素選擇器

子元素選擇器 h1 strong 這個規則會把第乙個 h1 下面的兩個 strong 元素變為紅色,但是第二個 h1 中的 strong 不受影響 後代選擇器 descendant selector 又稱為包含選擇器 h1 em 上面這個規則會把作為 h1 元素後代的 em 元素的文字變為 紅色。其...