レイアウトしよう

背景色を指定しよう

<body bgcolor="★">
<body >タグのbgcolor属性で背景色の指定が出来ます
色は16進数を用いたカラーコード(例#ff66ff)かカラーネームを使います
タグ使用例
<html>
<head>
<title>タグであそぼう!</title>
</head>
<body bgcolor="#008b8b">
</body>
</html>

背景に壁紙画像を指定しよう

<body background="★">
★=背景用画像のURL(同一ディレクトリにある場合はファイル名で指定)
タグ使用例
<html>
<head>
<title>タグであそぼう!</title>
</head>
<body background="img_01.gif">
</body>
</html>

文字や画像の中央揃え

<center>★</center>
★=中央揃えにする文字や画像
最近では<center>タグを使わず
<div align="★">〜〜</div>または<p align="★">〜〜</p>とする事を
推奨されています
★=left(左詰),center(中央揃え),right(右詰)

区切り線の表示

<hr>
<hr>は横方向に区切り線を引くタグです、終了タグ</>は必要なく単独で使用します

区切り線の幅を指定する

<hr width="★%">
★=ウィンドウ幅に対する%(ピクセル数でも指定できます)

区切り線の太さを指定する

<hr size="★">
★=線の太さ(ピクセル数で指定)

区切り線の色を指定する

<hr color="★">
★=#カラーコードまたはカラーネーム(Netscapeではカラー指定には
対応していません)
タグ使用例
<html>
<head>
<title>タグであそぼう!</title>
</head>
<body>
<hr width="85%" size="5" color="blue">
</body>
</html>

関連情報 区切り線にグラデーション効果を付ける

ボタンタグを使おう!

<button style="background-color: blue; color: white;
font-weight:bold">★</button>
★=ボタンに表示する文字列
サンプルではスタイルシートを用いて背景色や文字色を変えています