선택자의 타입들
이번 수업에서는 다양한 형태의 선택자를 알아봅니다.
- 태그 선택자
- 클래스 선택자
- 아이디 선택자
3가지의 선택자를 알아볼 것인데 여러분은 이미 1가지 선택자를 알고 계시고 2개만 더 배우면 됩니다.
태그 선택자
태그를 선택합니다. 아래 코드는 이 문서의 모든 li 태그라는 뜻입니다.
li{color:red}
아이디 선택자
아이디 속성의 값에 해당하는 태그를 선택하는 선택자입니다. 아래의 코드는 이 문서에서 id값이 select인 태그라는 뜻입니다.
#select{font-color:50px;}
예제 selector_1.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <!DOCTYPE html> < html > < head > < style > li{ color:red; text-decoration:underline; } #select{ font-size:50px; } </ style > </ head > < body > < ul > < li >HTML</ li > < li id = "select" >CSS</ li > < li >JavaScript</ li > </ ul > </ body > </ html > |
클래스 선택자
클래스 속성의 값에 해당하는 태그들을 선택하는 선택자입니다.