html

3) 선택자 (1)

1. CSS 선택자(Selector)

선택자란 말 그대로 선택을 해주는 요소다. 이를 통해 특정 요소들을 선택하여 스타일을 적용할 수 있게 된다.

2. 선택자의 종류

전체(universal) 선택자

  *  HTML 페이지 내부의 모든 태그를 선택한다.

 - 사용법

* {
  background-color: white;
}

태그 선택자

    해당하는 태그명을 선택합니다.

- 사용법

p {
  background: yellow;
}

ID 선택자

    해당하는 ID 속성값을 가진 요소를 찾아서 선택한다. 이 때 선택하려는 속성값 앞에 #을 사용해야 한다.

    ID는 한 요소에만 사용할 수 있기 때문에 유일하게 적용될 스타일에 사용한다.

  - 사용법

#idName {
  color: black;
  background: yellow;
}

클래스 선택자

    해당하는 클래스 속성값을 가진 요소를 찾아서 선택합니다. 이 때 선택하려는 속성값 앞에 마침표를 사용해야합니다. 클래스는 여러 요소에 지정할 수 있기 때문에 같은 UI를 사용할 때 사용하면 유용합니다.

  - 사용법

.className {
  color: black;
  background: yellow;
}