2009年2月14日土曜日

あったかーーいね。

 起き出したら温度計をみる癖がついているのですが、仕事部屋のあるところは北向きでいつも寒くて16度ぐらいしかないのですが、今朝はなんと暖房無しで22度もあります。昨晩結構強い風が吹いていましたが、あれが春一番だったのでしょうか。

 さて造り続けている七入オートキャンプ場のホームページですが、大量に文章を書きためてしまったおかげで、どこになにを書いたかさっぱりわからなくなってしまった。
 書いた本人がわからないのだから、読む方だってもっとわからないはずです。これではちょっとまずいと思って目次をつけてみたら、「おーー!これはわかりやすくていいんじゃない」って自分で感心してしまった。かなり重複しているところもあるので後でまとめ直すことにした。
 目次つけはじめたのはいいのですが、これはこれで結構大変なのです。飛び先を間違えないようにしなければいけないので、いちいち確認作業を繰り返すことになります。昨夜からかかってまだ先頭のページしか完成させられなかった。2ページ目は目次の多さにメゲテしまって飛び先の指定をしていません。これ全部やったら大変な作業量になってしまう。

 それから目次のDIVタグに管理人さんたちの写真を貼り付けた。右下のほうに貼り付けるってのがうまくいった。これもネット検索で調査した。

「 背景に画像【background-image】:CSS入門」について書いています。 (ブログ作成の体験レポートです)のサイトがわかりやすいですね。

#index{
  background-image  : url("./images/kanri200.jpg");
background-repeat  : no-repeat;
background-position : right bottom;
}

葉っぱがバックに散らしているのも同じ方法です。ただしbackground-repeat:no-repeat;を指定してないだけです。

それから、ページの一番上と下に額縁のような枠をつけたのですが

#head_waku {
width : 800px;
margin-top : 0px;
background-color : black;
border-style : outset;
border-width : 15px;
border-color : tan;
}

としただけなのですが、これが結構うまくいきました。ただここで注意しなければいけないのは、border-widthというのは外側に効いてくるのです。ですからwidth : 800px;と横幅を800pxと指定していますが、border-width:15px;設定してますから左右併せれば30px余分になるのです。ですから実際は横幅は830pxとなることです。これ最初から計算してなかったので困ったことになったのですが、他の枠も830pxにしてしまって誤魔化しました。
コメントを投稿