WEBサイト制作の勉強

WEBサイト制作の勉強の為の解説ブログです。

HTML5でのコンテンツモデル

f:id:yachin29:20150409231218j:plain

f:id:yachin29:20150409231706j:plain

各要素は、文書構造を作る上でページ内に複数使用することになります。
そこで、CSSJavaScriptに対応させるためには「ID名」が必須になります。

HTML5の記述例

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>HTML5の基本構造</title>
</head>

<body>
<header id="header">
<h1>HTML5の基本構造</h1>
<p>メインコンテンツの本文</p>
<nav id="glovalNav">
  <ul>
    <li><a href="#">メニュー1</a></li>
    <li><a href="#">メニュー2</a></li>
    <li><a href="#">メニュー3</a></li>
    <li><a href="#">メニュー4</a></li>
    <li><a href="#">メニュー5</a></li>
  </ul>
</nav>
</header>
<section id="content">
<h1>セクションの見出し</h1>
<p>セクションコンテンツの本文</p>
</section>
<footer id="footer">
<p>(c)2015 WebDesign</p>
</footer>
</body>
</html>