今天做一個頁面,無意中看到這個nth-of-type感覺挺方便的,之前單雙行有的有橫線,有的無橫線一般在html中單獨再寫border-right:none等之類的。現在發現這個好東西趕緊記錄下來。 :nth-of-type(n) 選擇器匹配屬於父元素的特定類型的第 N 個子元素的每個元素.n ...
發現問題 今天工作才發現的,原來我一直就理解錯了 MDN官網對這個選擇器的的定義是: :nth of type 這個 CSS 偽類是針對具有一組兄弟節點的標簽, 用 n 來篩選出在一組兄弟節點的位置。 在每組兄弟元素中選擇第四個 元素 p:nth of type n color: lime 重點來了 他說明的是標簽,針對的只是標簽,因此,比如網上關於這個問題的代碼: 是起不來任何作用的 因為該選擇 ...
2021-08-03 10:35 0 125 推薦指數:
今天做一個頁面,無意中看到這個nth-of-type感覺挺方便的,之前單雙行有的有橫線,有的無橫線一般在html中單獨再寫border-right:none等之類的。現在發現這個好東西趕緊記錄下來。 :nth-of-type(n) 選擇器匹配屬於父元素的特定類型的第 N 個子元素的每個元素.n ...
屬性 描述 CSS :active 向被激活的元素添加樣式。 1 :focus 向擁有鍵盤輸入焦點的元素添加樣式。 2 :hover 當鼠標懸浮在元素上方 ...
結構偽類是css3新增的類型選擇器。 E:nth-child(n)、E:nth-of-type(n)就是其中之二。搞懂了這兩個,基本上跟他倆一家的其他幾個兄弟伙基本上也可以弄懂了。 首先先用文字語言來描述一下這倆: E:nth-child(n): 選擇父元素下的第n個子元素 ...
last-of-type選擇器 “:last-of-type”選擇器和“:first-of-type”選擇器功能是一樣的,不同的是他選擇是父元素下的某個類型的最后一個子元素。 示例演示 通過“:last-of-type”選擇器,將容器“div.wrapper”中最后一個 ...
選取指定類型(p)父元素下的第幾個子元素: 實例: ...
html代碼: 一、nth-child 1.1、nth-child(n) 父元素下的第n個子元素,n必須大於0,索引都是從1開始。 ps、這里僅僅說是父元素的第幾個子元素,而並沒有限制該類型的子元素。比如: 運行之后 ...
css3: nth選擇器 我們把CSS3的:nth選擇器也稱為CSS3 結構類 選擇方法: :first-child(),:last-child () :nth-child(n) :nth-last-child() :nth-of-type ...
CSS3選擇器最新部分,有人也稱這種選擇器為CSS3結構類,下面我們通過實際的應用來具體了解他們的使用和區別,首先列出他具有的選擇方法: :first-child選擇某個元素的第一個子元素; :last-child選擇某個元素的最后一個子元素; :nth-child()選擇某個元素 ...