livedoor ナレッジ

記事タイトルに背景色をつけるには？

それぞれの記事タイトルに蛍光ペンのように
背景色をつけたいと思うのですが、CSSを
どのようにカスタマイズすればいいのでしょうか。
なにぶん初心者ですので教えてください。

.titlebody
{
background-color: 背景色;
}

↑これ↑をCSSに追加すれば出来ると思います。

色の指定方法は、色の名前を入力(red,blue.....)、
#の後に16進数で赤、緑、青の数値を入力(例　青　#0000FF　　黄　#FFFF00)などの方法があります。

カスタマイズ/管理 →　デザインの設定 →　カスタマイズ　→スタイルシート（CSS） と進みます。

枠一杯に何か文字列が書いてありますが、これをスタイルシート（CSS） と言って、ブログのデザインを指定している命令文です。

全文コピーしてワードパットなどにペーストして保存して置いて下さい。それでスタイルシート（CSS）のバックアップになります。


このなかに、

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

↑こういう感じのところがあります。
これはタイトル部分の文字のスタイルを設定しています。

a　文字のスタイルの指定
a:link　文字のリンクのスタイルの指定
a:visited　訪問済みリンクの文字のスタイルの指定
a:hover　マウスカーソルを載せたときのリンクの文字のスタイルの指定

text-decoration　文字飾り　none：なし　underline：下線

#333333　カラーコード　色を指定する文字列
http://www.htmq.com/color/index.shtml　←参考にされて下さい。


タイトルの文字というのは、リンクになっていますので、リンクとか訪問済みリンクとか、マウスカーソルを載せたときのリンクのスタイルを指定します。

#banner a{color:#333333;text-decoration:none;}
#banner a:link{text-decoration:none;background:#FF0066;}
#banner a:visited{text-decoration:none;background:#FF0066;}
#banner a:active{text-decoration:underline;}
#banner a:hover{text-decoration:underline;background:#FF9900;}

上記のような感じでスタイルシート（CSS）を変更し、保存して、スタイルシート（CSS）を再構築してみて下さい。
サイトを確認すると、背景色が付いていると思います。



カラーコードは好きな色のものを選んで変更されていいです。

イメージとあわない場合は、バックアップしたものに内容を戻してください。