선택자의 종류
태그 선택자
: 특정 태그를 사용한 요소에 스타일 적용
id 선택자
- 특정 요소에 스타일 적용
- 웹 문서에서 고유한 식별자를 정의할 때 사용함
- 대체적으로 큰 골격의 이름에 사용하는 것이 좋음
- 같은 id 이름을 중복해서 사용하지 못함 하나의 요소에 여러 개의 id를 동시에 사용하지 못함
- 대체적으로 상단의 헤더, 왼쪽 메뉴, 가운데 컨텐츠 영역, 하단의 footer 영역에 사용됨
ex) id = "title" ==> #title
class 선택자
- 특정 요소에 스타일 적용
- 같은 클래스의 이름을 여러 요소에서 중복해서 사용할 수 있음
- 가장 많이 사용되는 선택지
ex) class="main_text" ==> .main_text
id, class 선택자 예시
=============================코드=============================
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
#title{ /* id가 타이틀인 것을 찾아라! */
color: blue;
}
.main_text {
font-weight: bold;
font-size: 20px;
color: red;
}
</style>
</head>
<body>
<h1 id="title">제목1</h1>
<h1>제목2</h1>
<hr>
<p class="main_text">본문1</p>
<p>본문2</p>
<p class="main_text">본문3</p>
<p>본문4</p>
<p class="main_text">본문5</p>
</body>
</html>=============================실행=============================
