實(shí)例

選擇屬于其父元素的首個(gè)子元素的每個(gè) <p> 元素，并為其設(shè)置樣式：

p:first-child
{ 
background-color:yellow;
}

親自試一試

瀏覽器支持

所有主流瀏覽器都支持 :first-child 選擇器。

注釋?zhuān)簩?duì)于 IE8 及更早版本的瀏覽器中的 :first-child，必須聲明 <!DOCTYPE>。

定義和用法

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

親自試一試 - 實(shí)例

例子 1

選擇每個(gè) <p> 中的每個(gè) <i> 元素并設(shè)置其樣式，其中的 <p> 元素是其父元素的第一個(gè)子元素：

p:first-child i
{
background:yellow;
}

親自試一試

例子 2

選擇列表中的第一個(gè) <li> 元素并設(shè)置其樣式：

li:first-child
{
background:yellow;
}

親自試一試

例子 3

設(shè)置每個(gè) <ul> 的首個(gè)子元素，并設(shè)置其樣式：

ul>:first-child
{
background:yellow;
}

親自試一試

相關(guān)頁(yè)面

CSS 教程：CSS 偽類(lèi)