728x90
728x170
* id와 class
- 속성 중에는 글로벌 속성이라는 거의 모든 요소에 지정할 수 있는 것이 있음.
- 그중에서도 중요한 것이 'id 속성'과 'class 속성'
- 이러한 것은 스타일시트나 JavaScript와의 연결에 사용됨.
* id 속성
- id 속성은 요소에 식별자를 지정함.
- 하나의 도큐먼트 안에는 동일한 이름의 id를 지정할 수 없음.
<div id="name">
* class 속성
- class 속성은 요소에 클래스명을 지정함.
- 하나의 도큐먼트 안에 동일한 클래스를 여러 개 지정할 수 있음.
<div class="name">
* 예제 코드
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27 |
<!DOCTYPE html>
<html>
<head>
<title>그림책 소개</title>
<style type="text/css">
p.text {
color: #999999;
}
#header {
background-color: #eeaadd;
font-size: 20px;
}
</style>
</head>
<body>
<h1>
<p id="header">그림책 시리즈에 대해</p>
</h1>
<h2>
<p class="text">그림책은 그림으로 설명하고 있으므로 쉽게 배울 수 있습니다.</p>
</h2>
<h3>
<p class="text">그림책 시리즈는 전국 서점에서 구입하실 수 있습니다.</p>
</h3>
</body>
</html>
|
cs |
내용 출처 : HTML5가 보이는 그림책 (ANK Co., Ltd 저, 성안당)
728x90
그리드형(광고전용)
'Programming > HTML5' 카테고리의 다른 글
| HTML5의 특징 (0) | 2017.05.19 |
|---|---|
| HTML5란? (0) | 2017.05.19 |
| HTTP 리스폰스 헤더 (0) | 2017.05.18 |
| XHTML (0) | 2017.05.17 |
| 메타 요소 (0) | 2017.05.17 |
| 폼 (Form) (0) | 2017.05.17 |
| table 태그 (0) | 2017.05.17 |
| 기본 태그 (0) | 2017.05.17 |
