三日坊主にはならないぞ！
こんにちはcairnです。
HTML個人講座3日目です。
今日は『div要素』を学習していきます。
『div要素』とは・・・
指定した範囲が一つのブロックエリアになるというものです。
ホームページに必要な領域を定義する場合にはdiv要素を利用しその範囲を指定します。
基本的に一つの画面上には、いくつかのブロックエリアが存在してきますので、
そのような場合は『id属性』で個別の名前を付けて指定していきます。
まず『div』の配置場所としては
<body>
<div>
</div>
</body>
このように<body>に挟む形となります。
ですが、このまま使用する例は少ないので実例として以下を挙げていきます。
①
<body>
<div id="container">
<header>
</header>
</div>
</body>
②
<body>
<div id="container">
<header>
</header>
<div id="sidebar">
<nav>
</nav>
</div>
</div>
</body>
③
<body>
<div id="container">
<header>
</header>
<div id="sidebar">
<nav>
</nav>
</div>
<div id="main">
</div>
</div>
</body>
④
<body>
<div id="container">
<header>
</header>
<div id="sidebar">
<nav>
</nav>
</div>
<div id="main">
</div>
<footer>
</footer>
</div>
</body>
①は
ウェブページの大枠を作り
<div id="container">
</div>
屋根を付けた
<header>
</header>
感じです。
②は
サイドバーを作りました。
<div id="sidebar">
<nav>
</nav>
</div>
③は
一番メインとなる部分を作りました。
<div id="main">
</div>
④は
一番下の部分に表示される枠を作りました。
<footer>
</footer>
以上のタグを使用すると、基本的なウェブページの枠組みを作ることができます。
※少し古臭い構成にはなりましたが(;'∀')
今日覚えたことは大工さんのお仕事に例えると、家の大まかな骨組みを作った感じですね。
それではまた明日( ´∀｀ )
