선택자(selector)란?
CSS의 효과가 적용될 태그를 지정
Id 선택자
- id 속성은 전체 문서에서 하나의 태그를 식별하기 위해서만 사용됨
- 우선순위가 가장 높음
- css 선택자에서는 #을 사용해서 id임을 표시
- 다음 예제는 id값이 memo인 태그의 컨텐츠를 빨간색으로 표시하도록 함
<style type="text/css">
#memo {
color:red;
}
</style>
<div id="memo">
red
</div>
Class 선택자
- class 속성은 일련의 태그를 그룹핑해서 하나처럼 제어하기 위해서 사용
- class 속성에는 공백으로 구분된 여러개의 class가 표시될 수 있음
- css선택자에서는 '.'을 사용해서 class임을 표시
<style type="text/css">
.red{
color:red;
}
</style>
<div class="red">red</div>
<p class="red intro">Hello world</p> <!-- 하나의 클래스에 두개의 클래스 이름이 정의됨 -->
type 선택자
- 특정 태그명을 가진 엘리먼트 전체를 제어하기 위해서 사용
- css선택자에서는 태그의 이름을 사용함
<style type="text/css">
h1{
color:red;
font-size:30px;
}
</style>
<h1>Hello world</h1>
