忍者ブログ
[345] [344] [343] [342] [341] [340] [339] [724] [337] [336] [335]

 デザインを変更してみようかと思って、やってみた。
そのやり方は、まあ、適当に行き当たりばったりでやってみた。

というのも、JavaScriptも同じだけど、
いちいち全部の仕様を頭で理解してから作りはじめたら、
自分の場合は、多分途中で投げ出す。^^);;

なので、まずは、なんでもいいから、変更して、どうなるかを画面で確かめて
また変更してを繰り返した方が、結局仕様は理解してなくても、
早くできる。別にCSSの大家になろうとは思わないので、

目的はただひとつ、デザインが変更できればいいのだ。


今回もその方法で実践してみた。

で、そのデザインは、どこにでもある単純なデザインで

  本文の背景は、青の直線(上、左)と影(右、下)の組合せ。
  メニュー枠は、青の点線(上、左)と影(右、下)の組合せ。
  背景画像で落ち着いたイメージに見せる。



で、スタイルシートはあまり詳しくないので、
まずは、変更したら画面で見られる環境を作ることからやってみる。

で、IEブラウザで自分のブログのトップページをPCに保存した。

そしたら、xxxxx.bblog[1]というCSSファイルが出来てたので、
この中のまずは、BBLOG用の背景画像ファイルを自分のPCにコピーしてきて
xxxx.bblog[1]ファイルも更新して、自分のPC環境のみで表示できるようにした。

次に、BBLOG用の背景画像を元に自分用の背景画像を作ってと、
これが自分にとっては一大イベントなんだけど、なんとか出来て、
ついでにBODY部の背景画像もなんとか作って。

ところがxxxx.bblog[1]を書き換えてみたら、思うように表示してくんない。
あっち行ったり、下のほうに逃げてったり、サイズがずれてたりと、
いろいろなところをいじっては見たが良く分からん。^^);;;

で、どうもDIVとかDDとかで、いろいろな領域に分割されているので、
まずは、相手を知ることが大事と、この領域がどんな範囲でどこに表示されているのかを
見るために、それぞれの領域の背景を適当な色にしてみた。

これで大体どんな感じなのかが分かった。
どうもMARGIN指定とPADDING指定が複雑に入り組みあってるし、
同じような定義がいろんなところにあって、分け分からないので、

これをあわせるように指定してみたり、
新たな定義を継ぎ接ぎしたりして、なんとか思いどうりのデザインに合わさってくれました。

で、ここまで出来たので、次なる思い付きは、
ブログのデザインを別のデザインに自動的に変更してみたーーーいなぁ。
ちょっと、考えてみよう。

拍手[0回]

PR

コメント


コメントフォーム
お名前
タイトル
文字色
メールアドレス
URL
コメント
パスワード
  Vodafone絵文字 i-mode絵文字 Ezweb絵文字


トラックバック
この記事にトラックバックする:
忍者ブログ [PR]
カレンダー
02 2024/03 04
S M T W T F S
1 2
3 4 5 6 7 8 9
10 11 12 13 15 16
17 18 19 20 21 22 23
25 26 27 28 29 30
31
フリーエリア
[-]最新トラックバック
プロフィール
HN:
7maru
性別:
非公開
自己紹介:

バーコード
ブログ内検索
[+]アーカイブ
アクセス解析