frontend/CSS
선택자 점(.)과 # 의 차이
Mr.코딩
2023. 7. 22. 23:30
CSS 스타일 부분에서 점(.)과 샵(#)은 서로 다른 선택자(selector)를 나타냅니다. 간단하게 설명하면 다음과 같습니다:
1. **점(.) - 클래스 선택자**: `.`을 사용하여 스타일을 적용할 HTML 요소의 클래스를 선택하는 선택자입니다. 클래스 선택자는 동일한 클래스 이름을 가진 여러 개의 요소에 스타일을 적용하는데 사용됩니다.
예를 들면, `.header`는 클래스 이름이 "header"인 모든 HTML 요소들에 스타일을 적용합니다. `header` 클래스를 가진 요소들은 `<header class="header">`와 같이 표시됩니다.
2. **샵(#) - 아이디 선택자**: `#`을 사용하여 스타일을 적용할 HTML 요소의 아이디를 선택하는 선택자입니다. 아이디 선택자는 유일한(id가 고유한) 요소에 스타일을 적용하는데 사용됩니다. 즉, 하나의 HTML 문서 안에서 특정한 아이디를 가진 요소는 단 하나만 존재해야 합니다.