HTML構造
HTML Living Standardに準拠したい
<html>
<body>
<header>
<div .container>
<img .logo>
<nav #gNav>
...
</nav>
</div>
</header>
<div .row>
<div .container #pageName>
<main>
<section> ... </section>
</main>
<article> ... </article>
<aside .lNav >...</aside>
</div>
</div>
<footer>
<div .container>
<p #cr>
</div>
</footer>
</body>
</html>
header , footer ,
main , section , article , aside , nav
nav … navigation
#gNav … Global navigation :No Versatility
.lNav … Local navigation : Versatility
#mainContainer(site width , box)
header, footer, .row > .container
header, footer, .row { width : 100%;}
.container { サイトの幅 }
.container > main > section > article
.container > main , aside
main
ページに１つ
<main>
<h1>
<h2>
</main>
section
<section>
<h1>...
<h2>...
</section>
article
<article>
<header>
</header>
<h1>...</h1>
</article>