● :nth-of-type(n)과 :nth-last-of-type(n)
:nth-of-type(n) 선택자는 부모 요소의 자식 요소 중 n번째로 등장하는 E 요소를 선택합니다. 만약 다음과 같이 선택자를 작성하면 부모 요소의 자식 요소 중 두 번째로 등장하는 p 태그에 스타일을 적용합니다.
05/04/nth-of-type.html
<style>
p:nth-of-type(2){
color:red;
}
</style>
(중략)
<body>
<p>lorem 0</p>
<div>
<p>lorem 1</p>
<span>span 1</span>
<p>lorem 2</p> /* 부모인 div 태그의 자식 요소 중 두 번째 p 태그에 스타일 적용 */
</div>
<div>
<p>lorem 3</p>
<span>span 2</span>
<span>span 3</span>
<p>lorem 4</p> /* 부모인 div 태그의 자식 요소 중 두 번째 p 태그에 스타일 적용 */
</div>
</body>