:first-child

:first-childCSS當中的一種偽類別(pseudo-class),代表任何身為長子的元素(親元素的第一個子元素)。

語法

:first-child

範例

範例 1

HTML 內文

<div>
  <span>This span is limed!</span>
  <span>This span is not. :(</span>
</div>

CSS 內文

span:first-child {
    background-color: lime;
}

呈現效果如下:

範例 2 - 使用 UL

HTML 內文

<ul>
  <li>List 1</li>
  <li>List 2</li>
  <li>List 3</li>
</ul>

CSS 內文

li{
  color:red;
}
li:first-child{
  color:green;
}

呈現效果如下:

規格

瀏覽器相容性

BCD tables only load in the browser

參見