やまだ系

コンピューターやWEB関連の情報収拾と整理、資格取得に関することを目的にしたブログ

まったりチョー入門その2

・・・つづけます。CSSでブログデザインの変更をかける際にどうやったらいいかをこれからちまちま書き連ねます。いろいろ手順とか方法とか。いちおう、どんなブログサービスでも共通です。

  1. ソースを表示して、目的の変更したい部分に関係する箇所を探してCSSで指定する方法
  2. ツールなどを使って、目的の部分関する箇所を確認してCSSで指定する方法

・・・どちらにしても、目的の箇所にかかっている命令がわからないとどうにもならないわけです;
命令って?なにかこれがClassだったりIDだったりすます、面倒なんで詳しくかきませんが、そこはそういう風に変更したい!ということをマーク付けるためのものっていうていどで良いと思います。
何かをするために印付けしておくと、CSSでその印付けに対して文字色が赤で罫線が灰色とかそういう指定をすることができるようになります。
1のソースを表示して、目的の変更したい部分に関係する箇所を探してCSSで指定する方法。
このブログをソースで表示します。IEだと[表示]ー[ソース]メモ帳で開かれた場合文字化けしてわからない方は、秀丸とかをダウンロードしてくださいそしてIEでソースを秀丸で見られるようになると思います。そうでなければ、このあとの2の方法で;
ソースが開かれたら検索したい文字列を検索します。今日のタイトル「やり過ぎ」を検索・・・最初に出てくるのは違うので;続けて検索します。すると見つかります。そのときの部分が

 <span class="title">やり過ぎ</sopan>

という風に表示されます。この span class="title"のCLASSっていうのが!CSSに記述する時の印です。なのでCSSでクラスtitleに対して文字色が赤とかサイズとか文字間隔とかを指定していきます。

CSSの記述先はブログサービスごとに異なるのでかきませんけど、変更できるもしくは記述できる画面を出して、検索してこのtitle部分の設定を変更します。

クラスの記述は普通

.title{ここに設定されている}

だと思いますclass="title"ではなく「.class」です。これがクラスtitleという意味になります;検索の結果・・・もしかして、まえに.main .class{設定}の設定ているようなこともありますし、目的が定められないかもしれませんが・・・。もしかすると複数ある場合は、CSSの最後の行に追記という方法が良いです。CSSの最後行に追記します。

span.title{
color:#f00;  //文字色「真っ赤」
font-size:120%;//文字サイズ「標準より120%大きく」
}

で保存しますと、変わるはずです。ちなみにspanはなくても大丈夫だと思いますが。・・・あーでも、面倒な方法ですが、ブログのようにすでに決まった位置に決まったクラス名がある場合はこの方法は有効です。・・・ちなみにCSSは最後の行に設定されたものが有効になるので、わからないときは最後の行に追記したりするとうまくいくことがあると思います。

べんりなその2は次回に。