6.背景とライン
背景を設定します。
背景というのはページの地の色です。
今編集しているページは地の色、背景が白ですよね？
それを別の色に変えたり、画像を持ってくることが出来ます。
背景色を変える
<body bgcolor="#000000">
bodyタグに↑のように挿入します。ここでは黒に設定しました。
色々やってみてください。
俗に、背景が黒い方がデザインを構築しやすいといわれています。
白という基本色の方が視覚的には見やすいのですが、デザイン作りは難しいそうです。
ちなみに、黒背景に赤文字を使うと浮き出た感じになります。
背景に画像を使う。
<body background="test.jpg">
bodyタグに↑のように挿入します。
実行すると分かりますが、画面いっぱいに設定した画像が敷き詰められます。
背景に画像を使い、固定する。
どういう事かというと、普通は、画像を背景に使うと自動的に敷き詰められます。
しかし、そのようにさせずに、一枚の画像として一箇所に固定することが出来ます。
やってみましょう。
<head> <STYLE TYPE="text/css"> <!-- BODY { background:url(test.jpg) #FFFFFF no-repeat fixed 50% 50% } --> </STYLE> </head>
↑のようにヘッダーにスタイルタグを挿入し設定します。
上の設定ですと、「test.jpg」を画面に対して縦50％横50％の位置に固定します。
つまり中心に固定することになります。
これも数字を変えて試してみてください。
ラインを引いてみましょう。
そうですね、この講座ではラインがいっぱい引いてあります。
色やサイズを変えることが出来るので、使いようによってはかなり実用的です。
<hr>
これが、ラインタグです。下のようになります。
サイズ
を変えてみます。
<hr size=5> <hr size=10>
長さ
を変えます。
<hr width=50%> <hr width=100>
％でもピクセルでも設定できます。自然とセンタリングされます。
<hr align=left width=50%> <hr align=center width=50%> <hr align=right width=50%>
こうすることで寄せることが出来ます。
影の無い
ラインを引きます。
<hr noshade> <hr noshade size=5> <hr noshade size=13>
ラインに
色をつける
ことが出来ます。
<hr color="#8855ee"> <hr color="#ee4499"> <hr color="#44dd66">
色をつけると、影の無いラインに自然となります。
次は７へゴ→
SEO
掲示板
[PR]
爆速!無料ブログ
無料ホームページ開設
無料ライブ放送
