【アメブロカスタマイズ】文字の大きさとリンクの色の変更

アメブロ

内藤です。

まずはやっておきたい必要最低限のカスタマイズです。

・文字を読みやすい大きさ(15px)にする
・リンクの色を目立つ色にする

をやっていきます。

記事とメッセージボードの文字を読みやすい大きさにする

こちらのCSSをコピーして貼り付けます

/* 記事、メッセージボードの文字 */
.skin-entryBody,.skin-message{
font-size: 15px; /*文字サイズ*/
line-height:1.5; /*行間*/
color:#000000;
}

記事、メッセージボードの
文字サイズを: 15px
行間を: 1.5
文字色を:黒

にするCSSになります。

※サイドバーのプロフィール画像が丸いCSS編集用デザインを使っている場合のCSSです。

(旧デザイン)記事とメッセージボードの文字を読みやすい大きさにする

サイドバーのプロフィール画像が四角のCSS編集用デザインを使っている場合はこちらになります。

/* 記事、メッセージボードの文字 */ 
.articleText,.skinMessageBoard{
font-size: 15px; /*文字サイズ*/
line-height:1.5; /*行間*/
color:#000000;
}

リンクを青文字、太字、下線にする

記事やメッセージボードのリンクは特に目立って欲しい部分です。

こちらのCSSをコピーして貼り付けます

/* 記事、メッセージボードのリンク文字 */
.skin-entryBody a,.skin-message a{
font-size:15px; /*文字サイズ*/
font-weight:bold; /*文字の太さ*/
color:#0000ff; /*文字色*/
text-decoration:underline; /*文字装飾*/
}
/*リンクマウスオーバー時の半透明無効*/
a:hover{
opacity:1;
}
.skin-linkList li a:hover{
opacity:1;
}
.skin-headerTitle:hover{
opacity:1;
}

リンク文字が青文字、太字、下線になります。

※サイドバーのプロフィール画像が丸いCSS編集用デザインを使っている場合のCSSです。

(旧デザイン)リンクを青文字、太字、下線にする

サイドバーのプロフィール画像が四角のCSS編集用デザインを使っている場合はこちらになります。

/* 記事、メッセージボードのリンク文字 */
.articleText a,.skinMessageBoard a{
font-size:15px; /*文字サイズ*/
font-weight:bold; /*文字の太さ*/
color:#0000ff; /*文字色*/
text-decoration:underline; /*文字装飾*/
}

これら2つのカスタマイズをするだけでも、パソコンで見た場合に読みやすくなりますので試してみてくださいね

タイトルとURLをコピーしました