Develop/CSS

CSS - 선택자 ( selector )

codeGray 2022. 3. 27. 23:35
반응형

 

CSS 선택자


css는 선택자와 선언으로 이루어진다.

 

예를 들면 p 태그의 글자색을 빨간색으로 한다 라는 css 를 작성하면

 

p  { color : red }

이런 식이다.

 

여기서 p는 선택자이고 나머지는 선언이다.

 

선택자는 여러가지가 존재하는데 우선 기본적인 것만 정리한다.

 

1. 전체선택자 

 

전체 선택자는 HTML 내부의 모든 요소에 css를 적용한다. 

* { color : red }

 

2. 태그선택자

 

태그 선택자는 HTML 내부의 내가 정의한 태그만 css를 적용한다.

p { color : red }
div { color : red }

 

3. 클래스선택자

클래스 선택자는 HTML 내부의 내가 정의한 클래스만 css를 적용한다.

 

클래스 명은 자신이 임의로 정한다.

.container { color : red }

 

4. ID 선택자

ID 선택자는 HTML 내부의 내가 정의한 ID만 css를 적용한다.

 

ID는 자신이 임의로 정한다.

#box { color : red }

 

 

반응형