:nth-child(n) ---->選中某個元素,該元素必須是某個父元素下的第n個子元素;
p:nth-child(n) ---->選中p元素,且該p元素必須是某個父元素下的第n個子元素
注意:n是從1開始的
如下**,p:nth-child(1),只會選中第二個div中第乙個子元素p;
不會選中第乙個div中的第乙個p,因為第乙個div中第一p元素不是第乙個子元素
div span中第乙個段落。
div 中第乙個段落。
div 中的最後乙個段落。
另乙個 div 中第乙個段落。
另乙個 div 中的最後乙個段落。
正方向範圍
li:nth-child(n+6)
選中從第6個開始的子元素
負方向範圍
:nth-child(-n+9)
選中從第1個到第9個子元素。使用 :nth-child(-n+9) ,就相當讓你選中第9個和其之前的所有子元素
前後限制範圍
:nth-child(n+4):nth-child(-n+8)
選中第4-8個子元素。使用 nth-child(n+4):nth-child(-n+8) 我們可以選中某一範圍內子元素,上面的例子裡是從第4個到第8個子元素
奇數、偶數字
:nth-child(odd)
:nth-child(even)
:nth-child(3n+1),
選擇1,4,7,10
範圍高階用法
nth-child(n+2):nth-child(odd):nth-child(-n+9)
使用 nth-child(n+2):nth-child(odd):nth-child(-n+9) 我們將會選中的子元素是從第2位到第9位,並且只包含奇數字。
CSS關於選擇器 nth child n
之所以要單開一篇博文寫這個選擇器,是因為我在刷題的時候發現這個選擇器的定義是 匹配屬於其父元素的第 n 個子元素,不論元素的型別 1 我不太明白所謂的 不論元素的型別 是什麼意思,剛開始我以為是不論標籤元素型別,也就是說 選擇當前標籤e的父級元素的第n個子元素,不論這個元素是否是e標籤,但是我寫了乙...
使用CSS 的3種方式
css cascade style sheet 層疊樣式表憑著著 豐富的樣式 簡單易用 重複使用 縮小檔案 等優勢成為了現代網頁必不可少的一樣技術。需要注意的是,目前我們將css定義為樣式表中的一種,未來可能有其他樣式表被開發出來。直白地說,css就是一系列樣式的集合,它用於定義文件元素的外觀表現形...
CSS3 box shadow 陰影使用
css3 box shadow 內陰影與外陰影 1 box shadow具體使用方法,語法 e 換句說 物件選擇器 取值 投放方式 預設是外陰影 box shadow屬性至多有6個引數設定,他們分別取值 陰影型別 此引數是乙個可選值,如果不設值,其預設的投影方式是外陰影 如果取其唯一值 inset ...