CSSを記述してみよう

:「Q太郎さん、まずブログタイトルの文字を
変えたいんですけど、その時は#banner h1{　}ってところに
font-size:★;やfont-family:★って記述すればいいんだよね」

：「ああ、そうだ」

：「もし、#banner{　}に記述すると、ブログタイトルとサブタイトルの
両方が変わってしまうの？」

：「#banner h1と#leadに何も触れていなければ変わらない。
前回の優先順位の法則だ」

：「そっか、全体よりも部分が優先されるんだよね。
じゃあ、ちょっと記述してみるよ。
えーっと、文字の大きさが20pxで、色は青、フォントは富士ポップに
してみようかなと。
#banner h1{
margin:0;
padding:80px 0 0 14px;

font-size:20px;
font-family: '富士ポップ';
color:blue

}
これでいいのかな。よしプレビューで確認してみよう～」

なじむ　実に！　なじむぞ
過程や・・・！　方法なぞ・・・！　どうでもよいのだァーッ

：「Q太郎さん、文字の色も、大きさも、フォントも変わってますよ」

：「べいすた成長したな。このCSSを指定したのは
まぎれもなくべいすた、お前だ」

：「今度はサブタイトルもいじってみようかな。
サブタイトルは#leadだったよね。
うーん、斜体にボーダーなんてどうかな。

#lead{
padding:0 14px;
color: #ad0f00;

font-style:italic;
border-bottom:black dotted 7px;

}

なじむ　実に！　なじむぞ
過程や・・・！　方法なぞ・・・！　どうでもよいのだァーッ

:「Q太郎さん、出来ているよ～。
もうCSS怖くないぞ!!」

：「やれやれだぜ」

to be continued

タグ：サブタイトル ブログタイトル so-net カスタマイズ ブログ CSS