div要素

div要素はひとつのまとまり(グループ)を定義し、要素の内容に他のブロック要素を含める事が出来ますので、見出しや段落などをグループ化することができます。

例)

<div>
<h2>テキストAAAaaa</h2>
<p>テキストBBBbbb</p>
<p>テキストCCCccc</p>
</div>

Internet Explorer 9.0.3
div要素 グループ化 イメージ ie9


Mozilla Firefox 8.0.1
div要素 グループ化 イメージ ff8

※div要素にwidth: 450px;、border: 1px solid #cdcdcd;を指定しています。


align属性

div要素の内容の水平方向の表示位置を指定します

値)

<div align="center">
<h2>テキストAAAaaa</h2>
<p>テキストBBBbbb</p>
<p>テキストCCCccc</p>
</div>

Internet Explorer 9.0.3
div要素 align属性 イメージ ie9


Mozilla Firefox 8.0.1
div要素 align属性 イメージ ff8

※div要素にwidth: 450px;、border: 1px solid #cdcdcd;を指定しています。

※代替指定
align属性はスタイルシートのtext-alignプロパティで代替指定する事が推奨されています。


div要素とスタイルシート

class属性、style属性を用いてスタイルシートと組みあわせて使用する事で文書のスタイルを有効に定義できます。

例)

<div style="width: 450px;border: 1px solid #cdcdcd;">
<h2>テキストAAAaaa</h2>
<p>テキストBBBbbb</p>
<p>テキストCCCccc</p>
</div>

span要素

span要素はdiv要素と同じくひとつのまとまりを定義します。div要素がブロックレベルでのグループ化を行うのに対し、span要素はインライン(行内)を定義します。

また、div要素と同様に、class属性、style属性を用いてスタイルシートと組みあわせて使用する事で文書のスタイルを有効に定義できます。

例)

<p>テキスト<span style="color: #ff0000;">AAA</span>aaa</p>

Internet Explorer 9.0.3
div要素 align属性 イメージ ie9


Mozilla Firefox 8.0.1
div要素 align属性 イメージ ff8

※div要素にwidth: 450px;、border: 1px solid #cdcdcd;を指定しています。


ページトップへ戻る



RAWで撮ろうLife with a cameraLife with a camera 2


inserted by FC2 system