備忘録へ

2009年8月27日 木曜日

背景固定

スクロースしても背景が動かないように固定します。
お気に入りのアイコンやクリップアートを背景として利用するのに便利な技です。

ソースを＜head＞〜＜/head＞の間に貼り付けて下さい
("画像ファイル名")の中の部分を、表示したい好みの画像の名前にします。
※　勿論　画像はサイトの中の同じフォルダの中に入れておくこと。

真ん中に背景固定

<STYLE type="text/css"><!--
BODY{
background-image : url("画像ファイル名");
background-repeat: no-repeat;
background-attachment: fixed;}
-->
</STYLE>

左上に背景固定

<STYLE type="text/css"><!--
BODY {
background-image : url("画像ファイル名");
background-attachment: fixed;
background-position:0% 0%;
background-repeat: no-repeat;}
-->
</STYLE>

右下に背景固定

<STYLE type="text/css"><!--
BODY {
background-image : url("画像ファイル名");
background-attachment: fixed;
background-position:100% 100%;
background-repeat: no-repeat;}
-->
</STYLE>

右上は　100% 0%
左下は　0% 100%

のように%の部分を変更して下さい。