●○● 背景表示の指定方法 ●○●


スタイルシート(css)で表示したい場所にだけ背景を
表示させることが出来ます(未対応のブラウザもあります)。



基本

 背景表示を指定したいhtmlファイルのソースの中の
 <head>〜</head>の中へ↓を入れます。「背景画像のURL」は各自変えて下さい。
<style type="text/css">
<!--
body{
background-image:url(背景画像のURL);
★☆★
}
-->
</style>
 更に★☆★の部分をどう固定するかによって入れ替えます。


固定   ・・・
 いくらスクロールさせても動かない背景に。
 「c-stripe」の壁紙は基本的にこのタグで固定しています。このページもそうです。
background-attachment:fixed;

背景を繰り返すか   background-repeat    ・・・
 元々は縦も横も繰り返されています。それを変えたい場合に使用します。
background-repeat:●○●;
●○●に入るタグ :    横のみ繰り返す場合 : repeat-x
縦のみ繰り返す場合 : repeat-y
繰り返さない(1つだけ表示させたい)場合 : no-repeat
背景の位置   background-position    ・・・
 と併せて使用されることが多いです。
background-position:◆◇◆;
◆◇◆に入るタグ :    上 : top
下 : bottom
左 : left
右 : right
中央 : center
半角スペースを間に入れることで組み合わせることも出来ます。
ex) 右上 : right top / 左下 : left bottom




以上を組み合わせることで、背景の表示方法設定ができます。
全てを必ず使う必要はありません。必要に応じて使い分けてください。

    参考までに、このページの背景固定ソースは
<style type="text/css">
<!--
body{
background-image:url(snow3/09.gif);
background-attachment:fixed;
background-repeat:repeat-x;
background-position:top center;
}
-->
</style>




で背景を固定
で横一列表示
で表示位置は上の中央に。


    上一列固定背景です。







おまけ


くろつかがすぐ忘れる代用文字集。


'   &#039;
"   &quot;
&   &amp;
>   &gt;
<   &lt;
    &nbsp; (半角スペース)





2004.02.10 作成   ♪BGM:capsule「レトロメモリー」
SEO [PR] 爆速!無料ブログ 無料ホームページ開設 無料ライブ放送