CSS3 :nth-of-type() Selector

1097 단어
The :nth-of-type(n) selector matches every element that is the nth child, of a particular type, of its parent.
n can be a number, a keyword, or a formula.
Tip: Look at the :nth-child() selector to select the element that is the nth child, regardless of type, of its parent.
The :nth-of-type() selector is supported in all major browsers, except IE8 and earlier.
:nth-of-type(n) 선택기는 부모 원소에 속하는 특정한 유형의 N자 원소의 모든 원소와 일치합니다.
n은 숫자, 키워드 또는 공식일 수 있다.참조: nth-child() 선택기, 이 선택기는 부모 요소의 N번째 하위 요소를 선택합니다.
유형과 무관하다.
모든 주류 브라우저는: nth-of-type () 선택기를 지원합니다. IE8 및 이전 버전을 제외하고는.
p:nth-of-type(2){
background:#ff0000;
}

Odd와 이벤트는 하표가 홀수 또는 짝수인 하위 요소와 일치하는 키워드입니다. (첫 번째 하위 요소의 하표는 1)
여기서 홀수와 짝수 p 요소의 두 가지 배경색을 지정합니다.
p:nth-of-type(odd){
background:#ff0000;
}p:nth-of-type(even){
background:#0000ff;
}

방정식(an + b)을 사용합니다.설명: 주기의 길이를 나타낸다. n은 계수기(0부터), b는 편이값이다.
여기서 아래 첨자가 3의 배수인 모든 p 요소의 배경색을 지정합니다.
p:nth-of-type(3n+0){
background:#ff0000;
}

좋은 웹페이지 즐겨찾기