이 번역은 완료되지 않았습니다. 이 문서를 번역해 주세요.

The :first-child CSS pseudo-class represents any element that is the first child element of its parent.

문법

:first-child

예제

예제 1

HTML Content

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

CSS Content

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

... looks like ...

예제 2 - Using UL

HTML Content

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

CSS Content

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

... looks like ...

Specifications

Specification Status Comment
Selectors Level 4
The definition of ':first-child' in that specification.
Working Draft No change
Selectors Level 3
The definition of ':first-child' in that specification.
Recommendation No change
CSS Level 2 (Revision 1)
The definition of ':first-child' in that specification.
Recommendation Initial definition

브라우저 호환성

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 4.0 3.0 (1.9) 7[1] 9.5 4
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 1.0 1.0 (1.9.1) 7[1] 10.0 3.1

[1] Internet Explorer 7 doesn't update the styles when elements are added dynamically. In Internet Explorer 8, if an element is inserted dynamically by clicking on a link the first-child style isn't applied until the link loses focus.

참조

문서 태그 및 공헌자

이 페이지의 공헌자: ShihwanKim
최종 변경자: ShihwanKim,