壁紙素材のお持ち帰りについて
直リンク厳禁。壁紙素材はご自分のコンピュータにダウンロードし、保存してから使ってください。
マッキントッシュの場合 壁紙のサンプルのページで、持ち帰りたいサンプル画像にポインタをあてて捕獲しデスクトップに移動して保存(チョー簡単)。またはマウスで選択してメニューで「別名で保存」。
ウインドウズの場合 壁紙のサンプルのページで、持ち帰りたいサンプル画像にマウスをあて、「名前を付けて画像を保存」。
壁紙の特殊な設置方法について スタイルシートへ書き込む場合のタグの説明です。
1 壁紙をページの左、あるいは右に固定する サンプル
左側固定
<head>〜</head>内に以下のように書きます。
<style type="text/css">
<!--
body{
background-image : url(画像ファイル名);
background-repeat : repeat-y;
background-attachment : fixed;
background-position : 0% 0%;}
-->
</style>
※repeat-yは縦方向へ繰り返し表示します。background-positionは、「background-position: 20% 40%; 」と指定した場合、表示される領域の左端から20％、上端から40％の位置が背景画像の表示開始位置となります。従って「100％ 0%」にすると、右側に固定されます。
2 壁紙をページの上、または下に固定する
サンプル1（上） サンプル2（下）
<head>〜</head>内に、以下のように書きます。
<style type="text/css">
<!--
body{
background-image : url(画像ファイル名);
background-repeat : repeat-x;
background-attachment : fixed;
background-position : 0% 0%;}
-->
</style>
※repeat-xは横方向へ繰り返し表示します。background-positionを「0 ％ 100%」にすると、下部に左から固定されます。
3 壁紙をページ全体に繰り返さず、1枚だけ固定してはりつける
左下固定の例 サンプル
<head>〜</head>内に、以下のように書きます。
<style type="text/css">
<!--
body{
background-image : url(画像ファイル名);
background-repeat : no-repeat;
background-attachment : scroll;
background-position : 0% 100%;}
-->
</style>
※「background-attachment : fixed;」にすると、画像位置が固定されて、スクロールしても動きません。background-positionは、右下固定の場合、「background-position : 100% 100%」となります。またページの左上からの距離を、横方向と縦方向の順で、数値にpxなどの単位をつけて指定することもできます。またleft,center,rightや、top,center,bottomといった位置を表すキーワードでも指定できます。