도드넷
HTML 아웃라인, 섹션에 대한 개념정리. 본문
반응형
1. HTML에서 아웃라인(Outline)이란?
: <h1> 등의 타이틀 태그에 의한 웹문서의 구조를 구분하는 법. (-_- 별것도 아니고 안중요함)
- 참고 사이트 : 아웃라인 분석기
2. HTML에서 섹션(Section)이란?
: 레이아웃을 구성하는 단위. 직역하면 부분, 구획. (이게 중요 ★)
3. 예시1
다음.net 의 머리 부분
<header id="daumHead" class="head_daum">
<div class="top_head">
<div class="top_service #topbar">
<div id="allService" class="layer_service hide #topbar">
</header>
다음.net 의 몸통 부분
<main id="daumContent">
<aside id="cSub" class="cont_sub">
<hr class="hide">
<article id="mArticle" class="article_daum">
</main>
다음.net 의 꼬리 부분
<footer id="daumFoot" class="foot_daum #footer">
<div class="inner_foot">
</footer>
4. 예시2
네이버.com 의 머리 부분
<div id="header">
<div class="gnb">
<div class="lnb">
</div>
네이버.com 의 몸통 부분
<div id="container">
<div id="column_left">
<div id="column_right">
<div id="column_bottom">
<div class="column_bn">
<div id="svcmore" class="svcmore hide"></div>
</div>
네이버.com 의 꼬리 부분
<div id="footer">
<dl class="notice">
<p class="svc_all">
<dl class="policy">
<address>
</div>
네이밍도 틀리고;; 표현법도 틀리네요. @_@ 흐미;
반응형
'창고 > 웹 프로그래밍[구]' 카테고리의 다른 글
CSS 파일 HTML 파일에 적용시키는 법 (0) | 2014.09.18 |
---|---|
티스토리 선(경계선)긋기, 줄만들기 - 본문 박스만들기 (0) | 2014.09.13 |
HTML의 구조, 태그(tag)란 ? 기본적인 태그들 <html> <head> <title> <h1> <p> (1) | 2014.09.04 |
웹 사이트 제작에 필요한 프로그램소개! (0) | 2014.08.27 |
웹 프로그래밍 - HTML, CSS, 자바스크립트란? (0) | 2014.08.27 |
Comments