livedoor ナレッジ

文字の色の変え方について

私のBlogは以下の通りです。



一番上の写真の上に書いてある、タイトルとコメントの文字の色を変えたいです。あと、読者から書いてもらったコメントの色がグレーなのでこの色も変えたいです。文字の色の指定場所がいっぱいあってどこがどこだか分からなくなりました。

よろしくお願いいたします。

管理画面に入って、カスタマイズ/管理 ＞ デザインの設定 ＞ カスタマイズ ＞ を順にクリックしていくと CSS と 4つ の HTML のページが出てきます。その中の CSS の記述を変更します。

■ ブログのタイトル
#banner a{color:#FFFF33;text-decoration:none;}
#banner a:link{text-decoration:none;}
#banner a:visited{text-decoration:none;}
#banner a:hover{color:#FFFF33;text-decoration:underline;}

これは現在のあなたの CSS です。#･･････ のところを変更します。

■ コメントの文字の色？ （ ブログの説明の事ですよね？ ）
.description{
color:#FFFF33;
font-size:14px;
padding:5px 50px 0 15px;
}

これが現在の設定です。。#･･････ のところを変更します。

■ 読者からのコメント色の変更
.trackbacktext,.commenttext{
color:#666666;
font-size:12px;
padding:5px 0 10px 13px;
line-height:150%;
}

これが現在の設定です。。#･･････ のところを変更します。

管理画面で、カスタマイズ/管理　→　デザインの設定 →　カスタマイズ　→　スタイルシート（CSS） と進んで、出てきた文字列の内容を変更します。

念のため、内容をctrl＋Aで全て選択され、ctrl+Cでコピー、ワードパットにペーストし、保存されておいて下さい。
これでスタイルシートのバックアップとなります。

以下の部分を探して下さい。


タイトルは、リンクになっていますので、

#banner a{color:#FFFF33;text-decoration:none;}
#banner a:link{text-decoration:none;}
#banner a:visited{text-decoration:none;}
#banner a:hover{color:#FFFF33;text-decoration:underline;}

↑この部分のa:linkのcolor:#FFFF33;を変更して下さい。

a:visitedは訪問済みのリンクの色、
a:hoverはマウスカーソルを載せた時の色です。


こちらを参考に好きな色にされて下さい。
http://www.htmq.com/color/index.shtml


説明文は下記のcolor:#FFFF33;を変えられて下さい。


.description{
color:#FFFF33;
font-size:14px;
padding:5px 50px 0 15px;
}

コメントは下記のcolor:#666666;を変えられて下さい。

.trackbackttl,.commentttl{
color:#666666;
font-size:12px;
}

「トラックバックURL」「この記事へのコメント」などは下記のcolor:#666666;を変えられて下さい。

.trackbackurlttl,.trackbackhead,.commenthead,.takecommenthead{
margin-left:20px;
color:#666666;
font-size:12px;
font-weight:bold;
}


また、下記の部分のpadding:13px 50px 0 15px;を変更する事で、タイトルの位置を変更できます。上、右、下、左　の余白を指定しています。これを変えてタイトルの位置を変更されても良いかもしれません。


.blogtitle{
font-size:20px;
font-weight:bold;
padding:13px 50px 0 15px;
text-align:left;
}



表示が崩れたりしたら、バックアップしたスタイルシートに戻してください。


もしわからないことがありましたら、この質問のコメント欄にコメントをされて下さい。
詳しい方からより良い回答が寄せられると思います。