* 겪고 있는 문제 상황을 최대한 자세하게 작성해주세요.
* 문제 해결을 위해 어떤 시도를 해보았는지 구체적으로 함께 알려주세요.
수업을 듣다가 class로 나눠서 하는 거랑 id로 나눠서 하는 부분을 듣는 중 차이가 뭔지 모르겠어서 인터넷에 찾아봤습니다.
id는 고유한 하나의 요소만 스타일 변환
class는 여러개 요소를 한번에
이렇게 설명하길래 id가 여러개면 오류날 수도 있다고 찾은 후 실험해봤는데 오류가 안나서 결국 뭔 차이인지 모르겠어서 질문 드리게 되었습니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
/* id 선택 (단 하나만 존재) */
#main-title {
color: red;
font-size: 40px
}
#sub-title {
color: pink;
font-size: 30px;
}
/* class 선택 (여러 개 적용 가능) */
.box {
background-color: blue;
}
</style>
</head>
<body>
<h1 id="main-title">이건 빨간색 제목입니다</h1>
<div class="box">이건 파란색 박스</div>
<div id="sub-title">이것도 파란색 박스</div>
</body>
</html>
