背景画像サンプル

好きな画像にマウスポインタを合わせて右クリックして、名前をつけて保存 する。このとき

デスクトップ → Z:ドライブ

以下に保存する。保存するファイルが foo.jpg とする。 保存すると、royの中では ~/Windows/ ディレクトリに入るので これを Web 領域である ~/public_html ディレクトリに移動する。

% mv ~/Windows/foo.jpg ~/public_html

背景画像を使いたいページの *.html ファイルの style 要素 内に

 body {background-image: url(画像ファイル.jpg);}

とすることで、背景画像を利用できる。ただし、暗い画像の ときは文字色(color:)を明るい色に、明るい画像のときは文字色を暗い色にしな いと文章が読めなくなるのでcolorプロパティも同時に定義 するように注意する。さらにいうと、読み手が画像表示をOFFにしている場合も 考えて背景画像の明るさに合わせてbackground-colorも定義して おくとよい。


情報リテラシー