|
利用の際は、『READ ME』 の [For YOUについて]内
素材として使用するばあいの注意(別窓)をお読みくださいm(__)m。
ポストカードを背景に使う時にはスタイル・シートを利用すると便利です。
通常のHTMLの背景指定だと、じつはカードのような大きさは
なかなかレイアウトが難しいんです。
特にイラストの加工をダメって言ってますしね、ウチ(^^;)。
このページの背景は以下のおまじないを使いスタイルシートで固定しています。
こんなでよければお試しください。
あまり細かいことは考えないでね。ワタシもそんなに詳しくないので、
問い合わせもゆるちて(^^;)。
※ All About ホームページ作成のページでは，こちらで使っている
スタイルシート（CSS）についてもガイドさんがピンポイントで
わかりやすく書いてくれていますので，参考にどうぞ(^^)
==== 以下、上手く出来なかったらごめんなさいTIP====
自分のHPの背景を変えたいページのHTMLソースを開いて
CSS（カスケード・スタイルシート）のおまじないを書き込みます。
※その前に、使う画像を必ず自分のHPスペースに入れておいてね(^^;)。
<head>〜</head>のあと、
<body> 〜</body>に挟まれた〜の本体部分（場所はどこでもいいはず）に
下のおまじないを作って入れてみます。
****************
<STYLE TYPE="text/css">
<!-- BODY{background: url("http://HPのURL/画像の入っているディレクトリ/画像の名前.jpg") no-repeat fixed 0% 100%; bgcolor="#FFFFFF" leftmargin="0" marginheight="0" marginwidth="0" topmargin="0" } -->
</STYLE >
****************
ちなみに For YOU の
あいさつカード『おたよりでちゅよ』のロボ(robo-post.jpg)を
そのまんまの大きさで上記のとおりに指定してあげると
このページの背景のとおりになります。
CSSのソースは下記のとおり。
****************
<STYLE TYPE="text/css">
<!-- BODY{background: url("http://hammytouch.com/foryou.img/robo-post.jpg") no-repeat fixed 0% 100%; bgcolor="#FFFFFF" leftmargin="0" marginheight="0" marginwidth="0" topmargin="0" } -->
</STYLE>
****************
（上記CSSおまじないは直リンクを避ける為に
ディレクトリ階層を一部実際とは変えてありますm(__)m）
左端に画像を寄せて縦にずらっと並べたい時は
上記の no-repeat を repeat-y に 変えればおっけー。
repeat-y の y は座標で言う所の「縦方向」ってことですね。
すると、こんな感じで背景が並びます。
ちなみに画像の名前.jpgのさいごの.jpgは拡張子ですので
画像の形式によって.gifだったりといろいろですので間違えないようにね。
うちで出している画像はほとんどのものがJPEG形式なので.jpgなのです。(^^;)。
●ヒトコト●
スタイルシートは便利なんですが、Netscape 4 など少し前の
ブラウザでは実行されませんので、背景が灰色になってしまいます。
あらかじめHTMLのほうで背景色を白などに指定しておくと
親切かもしれません。
今はたぶんどのHP作成ソフトにもスタイルシートが
簡単に実行出来るツールがあるようですんで、それでやるのが
いちばん簡単だと思う。
ただその機能がついていることに気がつかない人も多いみたいです(^^;)。
ちなみhttp://HPのURLはそのページからの絶対パスOR相対パスの記入
でもOKなのです。でも説明が出来ないのでフルパスで御容赦(^^;)。
|
