1. 다음의 결과물을 HTML로 작성하라.
- 시멘틱 요소 중 헤딩 요소(h1)와 목록 요소(ol, li, ul 연습)
-----------------------------------------------------------------
삼계탕 만들기
- 냄비에 물을 붓고 닭을 끓인다.
- 다음의 재료를 넣는다.
- 황기
- 마늘
- 대추
- 거품이 떠오르면 걷어 내고 소금, 후추로 간한다.
-----------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>li 요소</title>
</head>
<body>
<h1>삼계탕 만들기</h1>
<ol>
<li>냄비에 물을 붓고 닭을 끓인다.</li>
<li>다음의 재료를 넣는다.
<ul>
<li>황기</li>
<li>마늘</li>
<li>대추</li>
</ul>
</li>
<li>거품이 떠오르면 걷어 내고 소금, 후추로 간한다.</li>
</ol>
</body>
</html>
1. 헤딩 <h1>~<h6>
- 새로운 섹션을 소개하기 위한 타이틀 역할
- 중요도 순으로 h1, h2, h3, h4, h5, h6의 6개 요소 사용 가능
- 계층 구조 준수로 정보 인식성을 높일 수 있음
- 텍스트와 인라인 요소만 자식으로 가지는 블록 요소
2. 목록 (ul, ol, li)
1) ul 요소 : 아이템의 순서가 중요하지 않은 단순 목록. 번호가 찍히지 않는다.
2) ol 요소 : 순차 목록 정의. 앞에 번호가 찍힌다.
3) li 요소 : 앞에 점이 찍힌다. 텍스트와 모든 인라인, 블록 요소를 자식으로 가지는 블록 요소
'웹접근성과 웹표준' 카테고리의 다른 글
| CSS 박스 모델의 이해 (0) | 2013.07.20 |
|---|---|
| CSS 규칙과 선택자 (0) | 2013.07.20 |
| 웹표준, HTML/CSS에 관한 유용한 사이트 (0) | 2013.07.20 |
| 웹표준: 건너뛰기 링크 제공, 접근성 대체 텍스트 표현방법 (0) | 2013.07.19 |
| XHTML의 구문 요소 (0) | 2013.07.18 |
