文字サイズの設定方法について(1) | アメブロをカスタマイズしよう!

アメブロをカスタマイズしよう!

最近、サイトの見栄えやSEO対策により、アクセスアップを図ろうとする傾向が顕著になってきました。そこで、その解決策の一つとして、アメブロのカスタマイズを研究してみようと思います。あなたのブログのご参考にしてくださいね。

ご訪問ありがとうございます。
人気ブログランキングの応援
をして戴けると励みになります。



あなたは、記事を投稿するのに、
文字サイズをその都度設定していませんか?



デフォルト(既定値)では、12pxが設定されています。
12pxというのは、下図の赤枠内の大きさですが、ちょっと
小さいですよね。
↓↓↓
デフォルトの文字サイズ



文字サイズの設定は、その都度記事欄で設定すればできますが、
最初にCSSで設定したほうが便利です。



一括で文字サイズを変更するには、
CSSを変更します。



CSSの変更内容と変更後のブログの表示例を
まとめてみますね。



1 ブログ全体の文字サイズを変更する方法

[CSS]
html {
font-size:15px !important;
}

[ブログの表示例]
ブログ全体の文字サイズ

 

2 ブログタイトルの文字サイズを変更する方法

[CSS]
#header h1{
font-size 1.2em;/*--2.5px相当の文字サイズ--*/
}

[ブログの表示例]
ブログタイトルの文字サイズ



3 ページナビゲーションの文字サイズ変更方法

[CSS]
.page{
font-size:1.55em;
}

[ブログの表示例]
ページナビゲーションの文字サイズ



4 記事タイトルの文字サイズをCSS編集にて変更する方法

[CSS]
/*記事タイトル*/
.entry h3.title{
font-size:1.5em;
font-weight:bold;
line-height:1.1;
}

[ブログの表示例]
記事タイトルの文字サイズ



5 テーマの文字サイズ変更方法

[CSS]
.entry .theme {
font-size:1.6em;
}

[ブログの表示例]

テーマの文字サイズ



今回は、以上です。
続きは、次の記事で投稿します。



最後まで読んでいただき、
ありがとうございました。

少しでもお役に立ちましたら、
応援お願いします!!

人気ブログランキングへ