반갑습니다. 잡지식스토리의 촉끼남입니다.
이번에는 section태그에 대해서 알아보겠습니다.
일단, section 태그에 대해서 가볍게 개념 정리부터 들어가겠습니다.
section 태그
일반적으로 웹문서의 영역을 구분하는 가장 기본이 되는 태그입니다.
책으로 보자면 문장이 있고 문단이 있는데, section 태그는 문단이라고 이해하면 쉽습니다.
웹문서에서 영역을 구분하는 태그에는 section 태그 이외에도 nav 태그, article 태그, aside 태그가 있습니다.
HTML소스 문서입니다. 주황색 둥근 사각형 안의 section을 하나의 구분으로 사용하였습니다.
아.. 급하게 작성하다 보니, 사용언어 설정을 영어로 해 버렸습니다.
section 태그에 대한 포스팅이기 때문에 크게 상관은 없겠지만, 이왕이면 <html lang="en">을 <html lang="ko">로 수정하여 한국어를 사용 언어로 설정하는게 좋겠습니다.
다음음 IE10 브라우저로 확인한 웹문서입니다.
위와 같이 주황 둥근 사각박스가 하나의 세션을 나타냅니다.
이렇게 하여 section 태그에 대해서 가볍게 정리해 보았습니다.
HTML 소스 문서와 IE10 브라우저 문서를 비교화면서 확인해 보면 쉽게 이해할 수 있을거라 생각됩니다.
이번 포스팅은 여기까지이며, 다음에는 구분을 짓는 다른 태그들에 대해서 알아보도록 하겠습니다.
<!doctype html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>section 태그 알아보기</title>
</head>
<body>
<header>
<h1>대중교통수단의 종류</h1>
<p>대중교통수단의 종류에 대해서 알아보겠습니다.</p>
</header>
<section>
<h2>버스</h2>
<p>버스전용도로를 통해서 다니는 교통수단입니다.</p>
</section>
<section>
<h2>지하철</h2>
<p>지하에 건설한 철로를 통해서 다니는 교통수단입니다.</p>
</section>
</body>
</html>
'웹문서 공부' 카테고리의 다른 글
| [웹문서]footer 태그, 바닥글 나타내기 (0) | 2013.10.24 |
|---|---|
| [웹문서]nav태그, 내비게이션을 나타내기 (0) | 2013.10.20 |
| [웹문서]script태그, 스크립트 파일 사용하기 (0) | 2013.10.13 |
| [HTML]meta http-equiv 태그, 웹문서 초기 정보 설정하기 (0) | 2013.10.10 |
| [HTML]meta name태그, 웹문서의 정보를 나타내기 (0) | 2013.10.05 |
