2011年02月03日

【第53回】コメント欄の文字サイズを変更する

今回は、コメント欄の文字サイズを変更してみます。

Seesaaブログのコメント欄の構成は、第36回で解説したように、ご覧のような形となっています。

SD_036_02.jpg

このように複数のID・クラスが入れ子になって構成されているので、どの部分の文字サイズを変更するかによって、修正するCSSが異なります。

今回は、コメント欄全体の文字サイズを一括で変更してみましょう。

上の図でいうと、@#commentsの箇所を変更することになります。

★コメント欄の文字サイズを変更する方法★

#commentsfont-sizeプロパティを追加する。

▼▼▼ 変更前 ▼▼▼
#comments {
padding:10px 0px 10px 10px;
margin-top:25px;
background:#fff;
background-image:url(http://seesaa-blog-design.up.seesaa.net/image/marble02.jpg);
background-repeat:repeat;

}

▼▼▼ 変更後 ▼▼▼
#comments {
padding:10px 0px 10px 10px;
margin-top:25px;
background:#fff;
background-image:url(http://seesaa-blog-design.up.seesaa.net/image/marble02.jpg);
background-repeat:repeat;

font-size:16pt;
}
(注)灰色字箇所は、第38回で変更した箇所です。

この変更によって、コメント欄はご覧のような形になります。

▼▼▼ 変更前 ▼▼▼
SD_053_01.JPG

▼▼▼ 変更後 ▼▼▼
SD_053_02.jpg

簡単・・・ですが、あまり見栄えが良い例ではありませんね。
あくまでも参考として下さい。

なお、コメント欄の背景がマーブル模様になっているのは、上記の通り第38回で変更したからです。
興味のある方は、参考にして下さい。

▼▼▼▼▼▼▼▼▼▼▼▼▼
参考になりましたら
クリック&応援をお願いします
にほんブログ村 ブログノウハウへ
▲▲▲▲▲▲▲▲▲▲▲▲▲

【PR】FXシステムトレードで着実に利益を重ねる長期資産運用方法o(^0^)o ほくほくFX
【PR】日々の運用成績やユーザーの情報満載のブログo(^0^)o ほくほくポートフォリオ
posted by o(^0^)o ほくほく at 20:00| Comment(1) | PCブログデザイン | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
参考になりました!!
ありがとうございます!!!!
Posted by ポンダ宮 at 2013年05月22日 21:45
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。
※ブログオーナーが承認したコメントのみ表示されます。
×

この広告は180日以上新しい記事の投稿がないブログに表示されております。