ブログのタイトル文字色について。
fc2でブログを始めました。
色々検討して、公式テンプレートの「life」というものを選択しました。
ただ、タイトルの背景画像だけ変更しようと思い、色々苦労した結果、変更できました。
しかし、タイトルの文字色が灰色のため、今のままではタイトルがひどく見づらいのです。
そこでタイトルの文字色を変更しようとしましたが、どうにもそれに該当する部分が分かりません。
以下にスタイルシートを貼りますので、どなたかご教授下さい。
body {
font-family: Verdana ,sans-serif,Osaka;
background: #eee;
background-image: url(http://templates.blog.fc2.com/template/life/bacck6.gif);
background-position: 0 0;
background-attachment: scroll;
background-repeat: repeat;
font-size: 83%;
line-height: 1.6;
margin:0;
color:#232323;
}
a:link {
color:#bbb;
text-decoration: none;
}
a:active {
color: #999;
text-decoration: none
}
a:visited {
color: #777;
text-decoration: none
}
a:hover {
color: #d00;
text-decoration: underline;
}
/* h1 を大きくとって、背景画像を見せてます。 */
/* 出来る人は div 要素なんか使って、テンプレ弄った方がいろいろいいかも */
h1 {
background: #070;
/* 背景を差し込む場合は高さ 150px ぐらい推奨 */
background-image: url(http://blog-imgs-59.fc2.com/n/a/m/namakedaruma/201304221809488f4.jpg);
background-position: 0 0;
background-attachment: scroll;
background-repeat: repeat;
margin: 0;
font-size: 150%;
/* 文字の位置を変える場合、上下合わせて 6em 取るといいかも */
padding: 3em 3em;
/* 位置を真ん中にしない場合は以下で文字位置設定 */
/*
padding: 3em 0.7em 3em 0.7em;
*/
border-left: 1px solid #000;
border-right: 1px solid #000;
}
h1 a:link {
color: #fff;
text-decoration: none;
}
/* h2 要素は現時点で、横向きカレンダーで被せてるんで擬似背景設定になってます */
h2 {
background: #000;
background-image: url(http://templates.blog.fc2.com/template/life/back2.gif);
background-position: 0 0;
background-attachment: scroll;
background-repeat: repeat;
margin: 0;
padding: 0.5em;
text-align: center;
font-size: 100%;
font-style: normal;
border-left: 1px solid #000;
border-right: 1px solid #000;
color: #fff;
border-top: 2px solid #000;
border-bottom: 2px solid #000;
}
/* h2 要素に被る横カレンダー設定 */
.yokocal {
position: absolute;
left: 10%;
top: 16em;
border: 1px solid #000;
background: #777;
padding: 0.3em;
text-align: center;
margin: 0;
font-size:75%;
}
/* 背景色透過で、h1 要素最下部に表示する場合や、横カレンダーを表示させない場合は、
以下の設定の方がしっくりきます。*/
/* 背景画像によって、文字色の変更 */
/* この場合は h2 要素が見えるようになります */
/* h2 要素の上下のパディング 0.5em が大きくて気になる場合は減らす */
/* 参考までに h2 要素の上下パディングを 0 にした場合、
以下で記述の right 属性の top のプロパティを 14.5em から 13.4em へ変更 */
/*
.yokocal {
position: absolute;
left: 10%;
top: 13em;
padding: 0.3em;
text-align: center;
margin: 0;
font-size:75%;
}
*/
/* 横カレンダーの日付はリストを inline で横に並べてるので、不具合ある人もいるかも。*/
.yokocal li {
color: #000;
display: inline;
margin: 0 0.1em;
}
.yokocal a{
font-weight: bold;
}
.yokocal a:link {
color: #fff;
text-decoration: underline;
}
.yokocal a:visited {
color: #999;
text-decoration: underline;
}
.yokocal a:hover {
color: #f00;
text-decoration: none;
}
/* レイアウト設定 */
/* レイアウト構成は left の中に right を左側に入れ込んでるという感じ。
そのために、left 属性では左に大きくパディングを取ってます。
ので、left でも実際は、右側に表示されることになります。*/
/* 記事表示部分 */
.left {
margin: 0;
margin-left:1px;
padding: 0 0 0 18.7em;
border: 1px solid #000;
background: #fff;
}
/* メニュー部分 */
.right {
background: #ffe;
background-image: url(http://templates.blog.fc2.com/template/life/back3.gif);
background-position: 0 0;
background-attachment: scroll;
background-repeat: repeat;
width: 15.5em;
border-right: 1px solid #000;
border-left: 1px solid #000;
border-bottom: 1px solid #000;
position: absolute;
padding: 1.7em 0.7em;
top: 14.5em;
left: 0;
color: #232323;
/* left 属性のボーダーを使うためその分の余白 */
margin-left: 1px;
}
.right p{
margin: 0.3em;
font-size: 80%;
}
.right a:link {
color:#333;
text-decoration: none;
}
.right a:active {
color: #999;
text-decoration: none
}
.right a:visited {
color: #666;
text-decoration: none
}
.right a:hover {
color: #d00;
text-decoration: underline;
}
/* メニューの見出し*/
.right h3 {
font-size: 80%;
font-family: Verdana ,sans-serif,Osaka;
font-weight: normal;
color: #000;
letter-spacing: 0.1em;
margin: 1.7em 0 0 0;
padding: 0.2em 0.2em 0.2em 0.7em;
background: #ffd;
bo
お礼
できました。丸1日以上、引っかかっていました。 1週間程前からHPの作成を始めましたが、知らないことばかりで難行苦行の連続です。 助かりました、有難うございました。