FC2ブログ
九州熊本に住むパソコンインストラクターごりがお気楽に綴る日記です。PC初心者にとって役に立つことあるかもよぉ!
こんばんは、ごりですm(__)m

今日は、スクロールしても背景の画像が動かない設定についてお話しをしたいと思うのですが....

簡単に説明をすることができません^^;

HTMLのBODYタグ内で記述もできるのですが、より詳細な設定をしたい場合は、CSSカスケーディングスタイルシート)を使ってWebページのデザインをします。

CSSはホームページのスタイル(書体やレイアウトなど見栄えに関するもの)をまとめて記述します。
ホームページを記述するHTML言語でも、ある程度スタイルを記述することができますが、スタイルシートを使えばより効率よく詳細な設定ができるということです。

つまり、
「HTMLで文書構造を記述し、CSSで体裁を整える」ということです。

ごりがお気楽でないときに、少しずつ、ちょっとずつわかりやすくお話しができればなぁ??と思っています。


このページの珈琲カップを変更すると、せっかく作成してくださった方のデザインを壊してしまうので、別のページで、ちょっとだけ遊んで見ました。
ていうかぁ~~~ぁ、せっかくのテンプレートをいじりまわして壊れたら恐いのです^^;
ごりも勉強、勉強です^^;

以前紹介したマウスの使い方のページを覗いてみてください。
↓  ↓  ↓
マウスの使い方

このページを開いたら、ブラウザの表示メニュー~ソースをクリックします。
すると、表示されているページのソース表示を見る事ができます。

<STYLE type="text/css">から、</STYLE>までの記述にあります。
画像の固定の設定は、
background-color : #ffffff ;  ← 背景の色
background-image :url("image/mouse0.gif"); ← 画像のありか
background-repeat : no-repeat; ← 背景画像を繰り返しさせない
background-attachment: fixed; ← 固定の設定
background-position : 70% 25%; } ← 画像の位置(水平、垂直)

の5行です。

あらかじめ画像イメージは画像処理ソフトなどで、少し透明にしておくと、上にテキスト(文字)がのっても、見やすくなります。
色々な手法がありますが、あまり濃い色の画像は好ましくないと思いますよ!


『ビックリマン20th ANNIVERSARYアンコール版』発売までのカウントダウンをごりと一緒に楽しみましょう!
↓   ↓   ↓   ↓   ↓
『ビックリマン20th ANNIVERSARYアンコール版』発売まであと何日?



ごり:麦子ぉ~~、ビックリマンチョコ発売まであと30日やでぇ~(^_^)v
麦子だからあたいは、いらないわよ(ーー;)
ごり:( ̄Д ̄;) ガーン



ブログランキングに参加しています。
なんだか、今日はちょっと難しいと思った方、
ポチッと押して、清き1クリックをお願いしますm(__)m
↓   ↓   ↓
人気blogランキングへ

SEO対策:熊本 SEO対策:パソコン SEO対策:インストラクター SEO対策:グルメ SEO対策:お菓子 SEO対策:激辛