グラデーション壁紙スタイルシートサンプル
|
このページで配布している背景用画像は <BODY BACKGROUND="line10.gif"> ↑の様な普通の指定をすると ↓こちらのようにグラデが細かく連続する「目が痛い・字が読みづらい」背景になります。 |
| 連続表示のサンプル。 こうならないようにするためには、スタイルシートで「右端にのみ」配置されるようにしてください。 |
|
このページのスタイルシートタグ記述例 ↓こちらの画像をダウンロードしたら、 （画像の上にマウスカーソルを合わせて右クリック、開いたメニューから「名前を付けて保存」を選ぶ）  この背景を使いたいページに <style type="text/css"> <!-- body{ background-color:#bdbdff; /* 背景の色指定 */ background-image:URL(line10.gif); /* 背景画像へのパス */ background-position: right; /* 背景画像を右側に表示 */ background-repeat:repeat-y; /* 背景画像をY軸（縦方向）で繰り返し */ color:#000000; /* フォントの色指定 */ } --> </style> 上記のスタイルシートの記述を、あなたのサイトの環境（画像の保管場所とか）に合わせて書き直し、 <HEAD>〜</HEAD>に記述してください。 |
| するとこんな感じの表示になります。 なお、背景の色指定は、グラデーションの一番薄い部分と同じ色のカラーコードに合わせると 効果的かと存じます。 （それぞれの画像の下に16進コードを付記しましたので、参考にしてください） |
 |
 |
 |
 |
| グラデーション１ 青系（紺） 150x10 1.37kb #BDBDFF |
グラデーション２ 赤系（濃桃） 150x10 1.42kb #FFBDE7 |
グラデーション３ 緑系１（若葉） 150x10 1.40kb #cef7d6 |
グラデーション４ 灰系（メタル） 150x10 1.37kb #D9DCE3 |
 |
 |
 |
 |
| グラデーション５ 緑系２（青緑） 150x10 1.35kb #BDE7E7 |
グラデーション６ 紫系（赤目） 150x10 1.36kb #E7BDDE |
グラデーション７ 黄系（山吹） 150x10 1.41kb #EFE7B5 |
グラデーション８ 橙系（赤銅） 150x10 1.38kb #EFCEB5 |
こっちは「右端にのみ」用です。
