背景画像を表示するには

IE7.0

IE6.0

IE5.5

IE5.0

IE4.0

IE5Mac

N7.0

N6.2

N4.X

Opera6

Mozilla/5.0

背景画像を表示

ページ全体に、背景画像を表示するには　 background （バックグランド）タグに背景画像(画像URL)を指定する。

Webに、表示出来る静止画像の種類として、　 jpg　 gif　 png　などで、
その他の静止画像は、 OS・ブラウザにに依存した静止画像であり特定OS以外では、表示しないので
画像ファイルの種類に留意しよう。

◆　注　制限事項
webにアップする画像・写真ファイル名に、日本語・特殊文字・空白・全角文字・英数字大文字は使えません。
必ず英数字半角小文字で作成して下さい。　必須

ページ全体の、背景画像を指定　ページに、背景画像を表示して綺麗なページにしよう。
body要素内で設定をします補記　背景画像をスタイルで設定

背景画像を指定する際、背景色・文字色も必ず指定する　必須

**背景画像を設定したページの抜粋**
背景画像を設定したページ。

Webに、表示出来る静止画像の種類
jpg 　ジェイペグ Joint Photographic Experts Group
JPEGとは、フルカラーまたはグレースケールの画像圧縮方式の名称である。
圧縮方式には、画質の劣化を許容する不可逆圧縮方式と、劣化のない可逆圧縮方式の2種類があります。

gif　ジフ Graphics Interchange Format
Web上で画像を表示する際に用いられる形式で、8ビット（256色）までの画像を保存することができます。
拡張形式として、３種類の拡張形式がある。
【アニメーションGIF】。複数のGIFファイルをつなぎ合わせてアニメーションのような表示を行える。
【インターレースGIF】荒い画像から徐々に鮮明な画像に変化して表示する。。
【透過GIF(トランスペアレンシーGIF)】。背景色を透明にすることで背景とGIFファイルを同化させてポイントを強調できる。

png　ピング Portable Network Graphics
もともと、GIFの特許権問題を避けるためにWebでの普及をを目的にライセンス料の要らないフォーマット形式として開発されたファイル形式のことである。
GIF形式に比べて、ファイルの圧縮率が高く、画質の劣化も少ないことが特徴である。フルカラーの自然画を劣化無しで圧縮できる、1ピクセルあたりの情報量(色深度)として48ビット(赤青緑それぞれ16ビットずつ)まで扱える、各ピクセル毎に透明度を指定できる、ガンマ補正のパラメータを画像に持たせられる、などの特長がある。

ページ全体に、背景画を指定タグの解説
要素	属性	語源	読みかた	説明
body		body	ボディー	ページ全体の基本設定要素で、文書の実際の内容となる要素を記述します。
	background	background image	バックグラウンドイメージ	ページ全体の背景画像を指定します。
	bgcolor	background color	バックグラウンドカラー	ページ全体の背景色を指定します。
	text	text	テキスト	ページ全体の文字色を指定します。

はじめて、ページに背景画をつける場合美麗な画像を付けたくなるが、ウェブデザインとして、多少画像を犠牲にしても表示文字が読みにくくないか配慮が必要で、中間色・コントラストの差が大きい画像は出来るだけ避け、特に写真画像などは減色するかハーフトーン調にして本来の表示文字を優先するように。
やむを得ない場合、テーブルなどで背景色を指定して見やすいページを心がけましょう。

ページ背景に、サンプル bkkt020.gif　画像設定の例
フォルダーの設定をしていないので、表示画像は必ずページと同じ(フォルダー)に入れる。
コピー貼り付けでタグを作成ページに、貼り付けて下さい。

<html><head>
<title> 背景画像の表示 </title>
</head>
<body text="#eeffff" bgcolor="#669933" background=" bkkt020.gif ">
</body>
</html>

（注）何らかの原因で、背景画像が表示しない場合の対処として必ず背景色も指定しておくこと。

ページ全体の背景色の指定 属性　　　bgcolor="" background=""

背景画像が優先するが、背景画像が何らかの原因で表示しないトラブルの際の対処として、近似色の背景色も設定しておく、ページ全体にタイリングに画像を表示するので文字との兼ね合いを考えて画像・背景色の明度も、上げるか下げて文字が見難くならないように留意する。

ページ全体の文字色の指定　属性　 text=""　 bgcolor=""　background=""

なお、表示文字色も必ず指定しましょう（規定値は黒）　しない場合背景画像に文字が、とけ込んで判別できないページになりリピートしてもらえないサイトになるので心がけましょう。
（注） 上記のように、背景画像　背景色　文字色　いずれも指定すること。

ページに背景画像をタイリング表示するので、写真などを表示したい場合は、画像のサイズも考慮する。ブラウザによって、表示が異なるので注意が必要。

補記　背景画像をタイリングだけでなく、 style(css) で特定の位置（上下・左右・列・他）に配列することなど自在に表示出来ます。
ふりーなホームページ素材集の写真（花素材や風景素材）でも簡単に解説しています。
詳しくは、アップしている style(css)講座の、背景画像の設定で学習して下さい。

閑話　 ◆ 上記サンプル背景素材などの入手先 ◆
学習して、いずれページに背景画像を付けたい場合同じ管理人が、素材集をアップしています。背景素材数だけでも、半端でなくジャンル別総数約1000点以上を揃えており、なおペ－ジでの文字表示にも留意しています。
フリーだがら、自由に使用して下さい。使用に際して掲示板かメールでも頂けると作成の励みにもなりますので宜しくお願いします。　　ふりーなホームページ素材集　から