HTMLの基礎3：divによるグループ化

＊<div>タグ

divは、タグ自体に意味はないが、idやclassと組み合わせてグループ化することで、編集が容易になる。ヘッダー、メニュー、コンテンツなど、同じ背景色で塗られてるパーツや、同じ意味を持つコンテンツでまとめるといいだろう。

例：

<div id="container">

...

<div id="header">

...

</div>

<div id="menu">

...

</div>

<div id="content">

...

<div id="footer">

...

</div>

</div>

</div>

＊幅と高さ、左右配置の設定

例：

#container{
①width:②900px;
}
#header{
①height:②140px;
}
#menu{
width:265px;
③float:➃left;
}
#content{
width:635px;
③float:➃right;
background-color:#ffffff;
}

①width

幅を指定する為のプロパティ。

②px

幅を表す単位。他にも、%などがあり、数値＋単位によって表す。

③float

左右に寄せて配置する為のプロパティ。

➃left,right

③の数値になる部分。例のように、floatを使う場合は同時にwidthを明記しておくのがポイント。