Slow Style Story 3

さて、前回ブログの構造と書きましたが、
こちらにもヘルプページがあるので、
其方を見れば大体分かりますね。

とはいっても、最初にこれを見てもすぐには判るわけが無いのは当然です。
画像ソフトなどを使ってらっしゃる方は、レイヤーって言葉をご存知かと思います。
いわゆる紙芝居の紙がいくつかあるのですが、
上と言うか、手前に来るものは透明な部分、あるいは存在しない領域があり、
その部分は下の部分が見えるわけです。

このブログの構造の場合、bodyが一番下のレイヤーで、
その上に、実際のブログ内のコンテンツが載る＃containerがあり、
その上に、トップのバナーや、ブログの記事部分、サイドのメニュー部分、最下部のフッターが
並行して載っています。
後は、細かい部品がそれぞれの項目の枠内に配置されているわけです。

はるか昔のＨＴＭＬのみで書いていたころには想像も出来ない程楽にＨＰの形が出来るわけです。
そのおかけで、ある程度一定のページが出来るのですが、
如何せん、デザインは似たものになるのはいた仕方ないところです。

完全に独自の構造も組めないことは無いのですが、
それをやるくらいなら、その労力を内容に向けた方が良いのが本筋ですね。
ですので、基本は一番上と言うか、手前のレイヤーパーツ内のfontの色や大きさをいじる。
パーツを追加するなどが簡単ないじり方で、
基本パーツをいじる際には、それなりに手間が掛かりますし、
大きさなどの調整も必要です。

又、ＨＴＭＬとスタイルシートの関係を見る際には、それがどこに関係しているかを
ＨＴＭＬの文からキーワード検索掛けて調べてみると判ります。
とはいえ、公開されているＨＴＭＬ文の殆どはブログ記載部分ですので、
見えていないＨＴＭＬ文の相関関係は、fontのカラー指定などで調べるしか方法が無いですね。

最も簡単なのは、トップページのＨＴＭＬ文をメモ帳などにコピーして・・・
a class="クラス"　のクラス部分のキーワードがスタイルシートでどこにあるかを調べて、
その部分のスタイルシートのおまじないの指定を変えて、結果を見てみることです。

それが理解できれば、次はスタイルシートに対するヘルプで書かれている・・
それぞれのクラスで、ＨＴＭＬ文に無いものも・・・ほぼいじり方が理解可能です。

又、一般のいじり方としては、スタイルシート中のクラスは増設されないことが多いのですが、
記述部位を考えてクラスを新設し、メインや、個別記事中のクラス指定を入れ替えたり、
あるいは書き足すことによって、より細かいfontの指定も可能となります。

一番簡単なのは、スタイルシートで一塊になっている・・・
リンクアンカーのfontカラーを入れ替える方法で、
普通は、aのみや、a.なんらかの始まりで記述され、
同じようなものが5行続いてます。

ここのスタイルシートなどでは、
通常時
リンク時
訪問済み時
アクティブ時
マウスオーバー時
の順で記載されており、
その行の中のcolor：#～の部分で指定される色がそれぞれの状態での色となります。
#で始まる色記号は、前回書いておいたリファレンスＨＰに見本がありますので、
其方を見て、なるべく現在のブログ中に使ってないものを使って影響を見るのが楽です。

もし、文中にcolor文が無くても、他からまねをして追加しても問題なく結果が得られるはずです。

ただ、気をつけないといけないのは、ココでfontの大きさを指定すると、
いろいろと支障が出る場合があり、後に悩むこととなりますので、
よく考えてfontのサイズは指定してください。
このブログのスタイルシートでは、a.apostedのクラスでfontサイズの指定がされており、
それが悩む元になりました。
つまりは、それぞれのクラス記述でもfontのサイズが決められますし、
リンクのアンカーのクラスでも決められるので、どちらが優先するかを理解しないと・・・
いくらfontサイズをいじっても影響が見えずに・・・ループに陥ることになります。

又、それぞれの領域の横幅などは簡単に変更できるのですが、
それぞれ相関関係があり、一箇所の変更だけですむことは無いことが多いので、
幅などを変えられるときは相関関係を理解してください。
単なる足し算ですので、計算すれば良いだけの事です。

ちなみに、えらそうに？いろいろ書いていますが、
実は別ブログをいじる前は、ＨＴＭＬを少しかじっただけの素人でした。
でも、3週間ほど悩むと、これくらいはスタイルシートもいじれます。

スタイルシート関係の基本はこれくらいにして、
そのうち、私の使っているスタイルシートについては、
解説コメント付きで公開予定です。

ちなみに、急がれる方は、お気に入りの中の
車馬鹿の手記
に参考になる解説付きスタイルシートがありますので、
其方をどうぞ。
尚、あちらは前回削除しようと思っておりましたが残してましたので、
今月中かあるいはもう一週間ほど後に・・非公開化あるいは削除するかもしれません。

ご希望があれば、あちらのコンテンツもこちら風にアレンジしてこちらに公開予定です。
では、今回はここいらで・・・