2011年02月01日

【第51回】カテゴリ記事一覧の文字サイズを変更する

今回は、記事の末尾に掲載されるカテゴリ記事一覧の文字サイズを変更してみます。

SD_051_01.jpg

この部分は、Seesaaブログでは、.listCategoryArticleというクラスで定義されています。

さらにこの部分は箇条書きとなっているので、HTMLの箇条書きを表すul要素、およびその中の個々の箇条書き部分を表すli要素の組み合わせで、CSSが定義されています。

CSSでは、IDやクラスの中のHTML要素にのみスタイルを設定する場合、半角スペースを空けてそれぞれの要素を記載していきます。

従って今回の修正対象は、.listCategoryArticleクラスの中のul要素の中のli要素なので、CSS上では以下の記述となっています。

  .listCategoryArticle ul li {}

今回は、この中のfont-sizeプロパティを変更するわけです。

★カテゴリ記事一覧の文字サイズを変更する方法★

.listCategoryArticle ul lifont-sizeプロパティの値を変更する。

▼▼▼ 変更前 ▼▼▼
.listCategoryArticle ul li {font-size:x-small;}

▼▼▼ 変更後 ▼▼▼
.listCategoryArticle ul li {font-size:13px;}

このように変更すると、記事末尾のカテゴリ記事一覧の文字サイズがご覧のように変わります。

▼▼▼ 変更前 ▼▼▼
SD_049_03.JPG

▼▼▼ 変更後 ▼▼▼
SD_051_02.JPG

なお、Seesaaブログのこねこ(左サイドバー)テンプレートのデフォルト設定では、この部分は小文字になっています。
しかし今回の修正では、記事本文の文字サイズと同じ大きさにしてみました。

繰り返しになりますが、Seesaaブログのデザインカスタマイズは非常に容易なので、自分の好きな形にどんどん変えてみましょう!

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

【PR】FXシステムトレードで着実に利益を重ねる長期資産運用方法o(^0^)o ほくほくFX
【PR】日々の運用成績やユーザーの情報満載のブログo(^0^)o ほくほくポートフォリオ
posted by o(^0^)o ほくほく at 19:59| Comment(0) | PCブログデザイン | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

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


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

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