프론트/Html Css
구조 가상 클래스 only-child /nth-of-type(n)
청어와물메기
2021. 8. 23. 08:51
728x90
0811 복습
"구조 가상 클래스"
웹문서의 구조를 기준으로 특정 위치에 있는 요소를 찾아 스타일 적용할 때 사용
일반적으로 스타일 적용할 때 class id 선택자 사용….
요소가 여러 개 나열되어 있는 경우에는 굳이 class나 id를 쓰지 않고 스타일을 지정(몇 번째인지 구분해서)할 수 있다.
only-child : 부모 안에 자식요소가 하나만 존재할때 자식 요소를 선택
first-child : 부모안에 있는 요소중에서 첫번째 자식을 선택
last-child : 부모안에 있는 요소중에서 마지막 자식..
nth-child(n) : 부모안에 있는 모든 요소 중에서 n번째 자식을 선택
nth-last-child(n) : 부모안에 있는 모든 요소 중에서 끝에서 n번째 자식을 선택
A:only-target-of : 부모안에 A요소가 하나만 있을때
A:first-of-type : 부모안에 있는 A요소 중에서 첫번째 요소 선택
A:last-of-type : 부모안에 있는 A요소 중에서 마지막 요소 선택
A:nth-of-type(n) : 부모안에 있는 A요소 중에서 n 번째 요소 선택
A:nth-last-of-type(n) : 부모안에 있는 A요소 중에서 끝에서 n 번째 요소 선택





*




728x90