css選擇器有哪幾種？

今天小編為大家分享的是有關(guān)css選擇器的介紹。小編覺得內(nèi)容豐富全面，為此分享給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧。

標(biāo)簽選擇器

例如：

`p`、`a`、`h[1,6]`、`span`、`div`、、、

類選擇器(class)

class 選擇器以 "." 來(lái)定義。

如：

.id1{樣式屬性：值;}

命名盡量別用下劃線，會(huì)出現(xiàn)兼容問(wèn)題，下劃線一般用于JS里，也不要用純數(shù)字或者中文名。

例如：

<div class="class1"></div>

注意：

類選擇器還包括多類名選擇器

<div class="class1 class2.."></div>

（視頻教程推薦：css視頻教程）

ID選擇器

id 選擇器以 "#" 來(lái)定義。 如：#id1{樣式屬性：值;}命名方式如類選擇器

例如：

<div id="id1"></div>

通配符選擇器

*{樣式屬性：值;}

偽類選擇器

鏈接偽類選擇器 (主要針對(duì)于a標(biāo)簽 可以沒有但是順序不能顛倒)

:link  /*未訪問(wèn)的鏈接*/:visited  /*已訪問(wèn)的鏈接*/:hover  /*鼠標(biāo)移動(dòng)到鏈接上*/     
最常用的鏈接偽類選擇器:active  /*選定的鏈接 別松開的狀態(tài)*/

結(jié)構(gòu)(位置)偽類選擇器CSS3

:first-child   選取屬于其父元素的首個(gè)子元素的指定選擇器

:last-child   選取屬于其父元素的最后一個(gè)子元素的指定選擇器

:nth-child(N)  匹配屬于其父元素的第N個(gè)子元素的每個(gè)元素，不論元素的類型，從最后一個(gè)子元素開始計(jì)數(shù)。N可以是數(shù)字，關(guān)鍵詞或公式

關(guān)鍵字 ：odd是奇數(shù)  even是偶數(shù)

表達(dá)式： 2n偶數(shù)  2n+1奇數(shù) n為倍數(shù)

:nth-last-child()是從最后一個(gè)子元素開始數(shù)  默認(rèn)是首元素

目標(biāo)偽類選擇器

:target目標(biāo)偽類選擇器  選擇器可用于選取當(dāng)前活動(dòng)的目標(biāo)元素

子元素選擇器

子元素選擇器只能選擇作為某元素子元素的元素。

寫法：

父級(jí)在前，子集在后，中間用 > 連接

注：> 兩邊各要有一個(gè)空格，不包含孫子，子孫集，只是兒子集不用 > 則可以選擇所有后代

屬性選擇器

選取標(biāo)簽帶有某些特殊屬性的選擇器可以使用屬性選擇器

寫法：a[title] {} 屬性選擇器中庸中括號(hào)來(lái)表示 div[class^=font] { } 以font開始的 div[class$=font] { } 以font結(jié)束的 div[class*=tao] { } 表示tao在任意位置都可以。

偽元素選擇器(CSS3)

.dome  類選擇器:first-child  偽類選擇器::first-letter 偽元素選擇器

E::first-letter  文本的第一個(gè)單詞或字

E::first-line  文本第一行

E::selection  可改變選中文本的樣式(鼠標(biāo))

E::before{ content:"文字" }  盒子內(nèi)部前面(加字體)

E::after{ content:"文字" }  盒子內(nèi)部后面(加字體)

以上就是css選擇器的介紹，內(nèi)容較為全面，小編相信有部分知識(shí)點(diǎn)可能是我們?nèi)粘９ぷ骺赡軙?huì)見到或用到的。希望你能通過(guò)這篇文章學(xué)到更多知識(shí)。