2024-10-10
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
#title {
color: blue;
}
#title2 {
color: green;
}
.main_text {
font-size: 20px;
font-weight: bold;
color: red;
}
</style>
</head>
<body>
<!--
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
선택자의 종류
* 태그 선택자 : 특정 태그를 사용한 요소에 스타일 적용
* id 선택자
- 특정 요소에 스타일 적용.
- 웹 문서에서 고유한 식별자를 정의 할 때 사용함.
- 대체적으로 큰 골격의 이름에 사용하는 것이 좋음.
- 같은 id 이름을 중복해서 사용하지 못함.
하나의 요소에 여러개의 id를 동시에 사용하지 못함.
- 대체적으로 상단의 헤더, 왼쪽 메뉴, 가운데 컨텐츠 영역,
하단의 footer 영역에 사용이 됨.
예) id="title" ==> #title
* class 선택자
- 특정 요소에ㅐ 스타일 적용
-같은 클래스의 이름을 여러 요소에서 중복해서 사용할 수있음.
- 가장 많이 사용되는 선택자.
예) class="main_text" ==> .main_text
-->
<h1 id="title">제목1</h1>
<h2 id="title2">제목2</h2>
<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>
