Frontend/CSS
2. CSS 기본 선택자
예린lynn
2024. 7. 4. 05:52
728x90
- 전체 선택자
- 태그 선택자
- id 선택자
- 클래스 선택자
- 그룹 선택자
전체 선택자
스타일을 문서의 모든 요소에 적용
* {속성: 값; ...}
태그 선택자
특정 태그를 사용한 모든 요소에 스타일 적용
태그명 {스타일 규칙}
id 선택자
고유한 식별자인 id 를 사용하여 요소 선택.
id 선택자는 문서에서 한 번만 적용할 수 있으며, 다른 선택자보다 우선순위가 높다.
#아이디명 {스타일 규칙}
클래스 선택자
HTML 요소에 임의의 클래스를 지정하여 해당 클래스를 가진 모든 요소를 선택.
.클래스명 {스타일 규칙}
그룹 선택자
여러 선택자에서 같은 스타일 규칙을 사용하여 적용
선택자1, 선택자2 {스타일 규칙}
스타일 우선순위
- 일반적으로 나중에 작성한 스타일이 먼저 작성한 스타일을 덮어쓴다.
- !important > 인라인 스타일 > id 스타일 > 클래스 스타일 > 태그 스타일
- 중요도가 같은 스타일이면, 스타일 적용 범위에 따라 우선순위를 결정한다.
- 스타일 적용 범위가 좁을수록 우선순위가 높다.
728x90