태그에 class라는 속성을 넣어 이름을 지을 수 있다.

태그마다 중복으로 넣을 수 있어 공통된 스타일을 적용할 때 쓰인다.

style이나 css에서 클래스를 부를 땐 네임 앞에 점을 붙인다.

예제에 적용된 코드를 가져와봤다.

1 2 3 4 5 6 7 8 9 10

<h3 class="title cook_title1">재료-4인분 기준</h3> <ul> . . . </ul> <h3 class="title cook_title2">조리법</h3> . . .

cs

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

.title{     color: #fff;     padding: 5px;     margin-left: 20px; } .cook_title1{     background-color: red;     border: 1px solid #000; } .cook_title2{     background-color: #ffc800;     border: 1px solid red; }

cs

위 예제엔 h3에 클래스가 2개씩 들어가있다.

클래스를 여러개 넣고 싶을 땐 띄어쓰기로 구분하면 된다.

태그에 id라는 속성을 넣어 이름을 지을 수 있다.

id는 class와는 다르게 중복 사용이 불가능하다.

style이나 css에서 아이디를 부를 땐 네임 앞에 #을 붙인다.

적용 방법은 class와 같다.