アイコンを壁紙にしてみましょう！（縦長・横長背景）

◆ソース(右側）は、すべて<HEAD>〜</HEAD>の間にコピーして入れてくださいね。

                         ■ background-color : #・・・・・・;　（カラーコードで選択した6桁の英数字）→カラーコード
                         ■ background-image:url(・・・.gif);　（アイコンを指定）
　
 上の赤と緑の部分を変更すれば、OKですよ。場所の目安は、<TITLE>タイトル</TITLE>の後に入れてください
　改行をひとつ入れてからコピペすると分かりやすいです。（）や、；を消さないように注意してくださいね。
◆お気に入りのアイコンを用意します。　
ここでは、アイコンの名前をrisu.gifとします。

ｈｔｍｌファイルとこのgif画像を同じフォルダーに入れる場合の説明です。
 　　　risu.gif
◆左の横に一列並ぶ壁紙です。

こんな感じになりますよ♪アイコンは、透過してありますので、

■ background-color : #d2e9ff;　（バックの色･･ブルー）
■ background-image:url(risu.gif);　（アイコンを指定）

　ソース⇒










<STYLE type="text/css">
<!--
BODY{
background-color : #dse9ff;
background-image:url(risu.gif);
background-repeat : repeat-y;
background-attachment : fixed;
background-position : left top;
}
-->
</STYLE>
◆右の横に一列に並ぶ壁紙です。

こんな感じになりますよ♪　　アイコンは、透過してありますので、

■ background-color : #ffffff;　（バックの色・・白に指定）
■ background-image:url(risu.gif);　（アイコンを指定）

 ソース⇒










<STYLE type="text/css">
<!--
BODY{
background-color : #ffffff;
background-image:url(risu.gif);
background-repeat : repeat-y;
background-attachment : fixed;
background-position : right top;
}
-->
</STYLE>
◆上部に一列に並ぶ壁紙です。

こんな感じになりますよ♪　アイコンは、透過してありますので、

■ background-color : #ffe8f3;　（バックの色・・ピンクに指定）
■ background-image:url(risu.gif);　（アイコンを指定）

  ソース⇒










<STYLE type="text/css">
<!--
BODY{
background-color : #ffe8f3;
background-image:url(risu.gif);
background-repeat : repeat-x;
background-attachment : fixed;
}
-->
</STYLE>
★上記のソースは、すべて壁紙が固定になっています。
（ページが長くなっても、壁紙はスクロールせずに、固定されます）
固定にしない場合は・・・ソースの中の　background-attachment : fixed;　の部分を削除してください。





Copyright (C) 2000-2004   Shangri_La  All rights reserved
http://kimi.cside.com/