반응형
내가 쓰다 헷갈려서 작성하는 선택자쓰기
선택자는 웹 문서에서 어느 부분에 스타일을 적용할지 알려 주는 것이며, 선택자를 사용하는 방법은 미리 약속되어 있습니다.
✨전체 선택자
* { 속성: 값; ......}
✨타입 선택자
태그명 {스타일 규칙}타입 선택자는 태그 이름을 선택자로 사용하므로 태그 선택자라고도 하고, 스타일을 적용하는 대상이 요소이므로 요소 선택자라고도 한다.
특정 태그를 사용한 모든 요소에 스타일을 적용한다.
✨클래스 선택자
.클래스명 {스타일 규칙}.(점)이 붙는다
특정 부분만 선택해서 스타일을 적용하려면 클래스 선택자를 사용한다.
✨id 선택자
#아이디명 {스타일 규칙}클래스 선택자와 마찬가지로 웹 문서의 특정 부분을 선택해서 스타일을 지정할 때 사용한다.
마침표(.) 대신 # 기호를 사용한다는 점만 제외하면 스타일을 정의하는 방법은 클래스 선택자와 같다.
🎯클래스 선택자와 id 선택자의 가장 큰 차이
클래스 선택자가 문서에서 여러 번 적용할 수 있는 반면, id 선택자는 문서에서 한 번만 적용할 수 있다는 것.
✨그룹 선택자
선택자 1, 선택자 2 {스타일 규칙}두 요소의 스타일 규칙이 같을 경우 그룹 선택자(,) 를 사용해 한꺼번에 정의할 수 있다.
반응형