HTML連載21-序選擇器上

時間 2019-12-14

標籤 html 連載選擇器欄目 HTML 简体版

原文原文鏈接

解釋CSS3 中新增的選擇器中最具備表明性的就是序選擇器，大體能夠分爲兩類：git

（1）同級別的第幾個（2）同類型的第幾個github

先寫一個公共代碼微信

<body>

<h1>優秀</h1>

<p>我是一梯隊</p>

<p>我是一梯隊</p>

<p>我是一梯隊</p>

<div>

    <p>我是第二梯隊</p>

    <p>我是第二梯隊</p>

    <p>我是第二梯隊</p>

</div>

</body>

1.選中同級別中的第一個學習

標籤：first-child｛屬性：值｝

注意點：不區分類型，只管取第一個，無論第一個是什麼標籤大數據

        p:first-child{

            color:red;

        }

解釋：在同級別中只選取第一個爲h1標籤和div下的p標籤，而後在這些裏面只選p標籤，進行標紅。ui

2.選中同級別中同類型的第一個spa

標籤：first-of-type{屬性：值；}

例子：.net

        p:first-of-type{

            color:red;

        }

解釋：先選出全部的p標籤，而後在這些p標籤中每個同級別的在選出一個。code

3.選中同級別中的最後一個視頻

標籤：last-child{屬性：值；｝

4.選中同級別中同類型的最後一個

標籤：last-of-type{屬性：值；}

5.選中同級別中的第n個

標籤：nth-chirld（n）:{屬性：值；｝

6.選中同級別中同類型的第n個

標籤：nth-of-type(n):{屬性：值；｝

7.選中同級別中的倒數第n個

標籤：nth-last-chirld（n）:{屬性：值；｝

8.選中同級別中同類型的倒數第n個

標籤：nth-last-of-type(n):{屬性：值；｝

2、源碼：d77_order_selector_first

地址:

https://github.com/ruigege66/HTML_learning/blob/master/d77_order_selector_first

2.CSDN：https://blog.csdn.net/weixin_44630050（心悅君兮君不知-睿）

3.博客園：https://www.cnblogs.com/ruigege0000/

4.歡迎關注微信公衆號：傅里葉變換，後臺回覆「禮包」獲取Java大數據學習視頻禮包

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。