メールマガジン「初心者のためのホームページ作り」でお伝えした内容を、「復習」の意味で掲載しています。テキストのみのマガジンと違って、実際のサンプルや画像を交えて解説していますので、理解が深まると思います。なお、疑問点や分からない点がありましたら、遠慮なく メールにてご質問ください。

プレーンテキスト版バックナンバー

＜第56号＞ 今週のおさらい
　　　　　　　　　　　　　　　　　  毎週金曜日配信　What's New 2003/6/27
〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓
　　　■ HTML講座  第５回 --- コンテンツの表現 / 文字コード
　　　■ XHTML講座　第17回 --- コンテンツの配置 その２

◆ HTML講座 --- コンテンツの表現

Webブラウザ画面にコンテンツを表示するためには、bodyタグの中で、実際に用意するコンテンツ（情報を提示するテキストや画像など）を配置します。この bodyタグは、その意味ではコンテンツを表示させるためのタグの最上位に位置します。

body直下に配置する見出しや段落、リストなどを全部ひっくるめて body要素と呼びます。つまり、body要素内に、表現すべきコンテンツが配置されるわけです。

■ body要素における論理構造

ちょっと難しくなります。

この講座で何度も説明していますが、HTMLは SGMLの原則を継承しています。文書の構造が論理的に記述されなければならないのです。そのため、むやみに body要素内にコンテンツを配置するわけにはいきません。

早い話が、body要素直下にはすべてブロックレベル要素に分類されたタグを配置しなければならないのです。基本的にブロックレベル要素は、文書の構造骨格を示す働きがあります。そのために、すべてのコンテンツはブロックレベル要素と呼ばれるタグの中に配置されなければなりません。

ブロックレベル要素一覧

タグ	機能
address	制作者の情報提示：E-maiなどを表記する
blockquote	長文の引用をする場合に利用する
div	汎用的に利用するブロックレベル要素
dl	定義リスト
fieldset	フォームの入力項目のグループ化
form	入力フォームの設定
h1〜h6	見出し（第１から第６まで）
hr	横罫線
ol	番号つきリスト
p	段落
pre	整形済みテキスト（余白、改行を含むテキストの表示）
table	表組（テーブル）
ul	番号なしリスト

（HTML4.01Strictのみ掲載）

基本的に、すべてのインラインレベル要素は、このブロックレベル要素の中で配置されます。body要素直下に、インラインレベル要素と呼ばれるタグを配置することができません。

インラインレベル要素とは、通常の文字列と同等に扱われるもので、前後に改行や余白などを持っていません。

インラインレベル要素一覧

タグ	機能
a	アンカーと呼ばれ、リンク先を設定する
abbr	発音できない略語を示す（例：W3C）
acronym	発音できる略語（頭字語）を示す（例：NATO ナトーと発音）
b	強調文字（物理タグなので利用を控えましょう）
bdo	テキストの表記方法の指定
bdo	テキストの表記方法の指定
big	大きい文字（物理タグ）
br	強制改行の指定
button	ボタンの設定
cite	引用元などの情報源の参照
code	短文のソースコードなどの出力結果の表示
dfn	削除された部分の設定（一般的に抹消線を表示する）
em	強調文字（一般的に斜体で表示する）
i	斜体文字（物理タグ）
img	静止画像の表示
input	入力フィールドの設定（フォーム以外の単独利用が可能）
kbd	ユーザによって入力された文字を示す
label	入力フィールドにラベル情報を設定する
map	イメージマップ機能を設定する
object	静止画や動画などのオブジェクトを表示する
q	短い引用文を表示する
s	抹消線を表示する（物理タグ）
samp	プログラムなどのソースの表示
select	プルダウンのメニュー項目の表示
span	汎用的に利用するインラインレベル要素
strike	抹消線を表示する（物理タグ）
strong	強調文字（一般的に太字で表示）
sub	下付き文字
sup	上付き文字
textarea	テキストの入力領域の設定
tt	テレタイプ文字（物理タグ）
u	下線付き文字（物理タグ）
var	プログラムなどの変数や引数などを表す

（HTML4.01Strictのみ掲載）

コンテンツを表現する body要素には、こうした規則があることをしっかりと覚えてください。コンテンツは必ずブロックレベル要素内で配置されるということこそが、HTMLの論理的な文書構造を構築する第１歩です。

◆ XHTML1.1講座 --- コンテンツの配置　その２

コンテンツの位置は、通常 XHTML（HTML含む）の記述順に並べられます。ここでは、その並び順を無視した 「絶対位置」について解説します。

■ 絶対位置

構文の記述順を無視して、指定した位置で表示させることを「絶対位置」と呼び、スタイルシートによって実現する表示方法です。

コンテンツの位置をどうしてもその位置でなければならない、というような場合に利用できる便利な設定です。

スタイルシートでは、position属性を利用します。なお、position属性の値には次のような機能を持っています。

position属性の値と機能一覧

値	機能
absolute	絶対位置の指定（ただし left、right を指定しなければならない）
static	デフォルト値（記述順に相対的に表示する）
fixed	指定した位置に固定して表示、スクロールしてもその位置にとどまる

絶対位置を指定した場合、現在のブロック（ボックス）の１つ外側のブロックの絶対位置が指定されます。多くの場合、何らかのブロックレベル要素内で絶対位置を指定した場合、１つ外側とは body要素であることが多いようです。

言い換えれば、絶対位置を指定留守場合には、必ずブロックレベル要素内のある要素に対して行うということがいえるでしょう。

position属性のサンプル （一部ブラウザによっては表示に難があります。）