[CSS] #2 선택자(selector)

1. 선택자(?)

CSS는 HTML 요소들을 꾸며준다고 했습니다.
여기서 HTML 요소들을 식별해 주는 역할을 하는 것이 "선택자(seletor)"라고 합니다.

2. id 선택자

HTML 요소에 id 값을 입력해주고 CSS에서 그 요소를 선택하기 위한 선택자는 #id값 으로 입력합니다.

<h1 id="text">hello</h1> <style> #text{color: red;} </style>

 

3. class 선택자

class값을 갖는 요소를 선택하기 위해서는 .class값 을 선택자로 사용합니다.

<h1 class="text">hello</h1> <style> .text{color: red;} </style>

 

4. 전체 선택자

전체 선택자(universal selector)는 말 그대로 HTML 요소 전체를 선택하는 선택자입니다.
* (별모양)을 사용하면 됩니다.

<style> *{color: red;} </style>

 

5. grouping 선택자

grouping 선택자는 HTML 태그명을 사용합니다. 밑의 예의 경우에는 h1 태그 전체를 선택하는 선택자입니다.

<style> h1{color: red;} </style>