川蜻蛉の舞う渓にて

改造計画Ⅰで、トップ画像を変更したは良い物の、
タイトル文字が、見にくくなってしまった！！
そんな方も居るのでは？

今回は、そのタイトル文字の変更方法です！
タイトルの下にある、自己紹介文の変更も、ついでに♪

#banner,#subbanner{
background:#fff url(/_img/fireworks/fireworks._top.jpg) no-repeat left top;
padding:0px 0px 0px 0px;
height: 220px;
}
ここは前回紹介した、「TOP画像」を変更するポイントです。
このすぐ下が、文字関連の変更箇所です。
（既存テンプレート「花火」を使用しています）

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

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



h1,h2,h3{margin:0px;padding:0px;}

.blogtitle{
font-size:30px;
font-weight:bold;
padding:5px 0px 0px 13px;
text-align:left;
letter-spacing:2px;
height:39px;
}
ここまでが、ブログタイトルの文字変更箇所です。
（テンプレートによっては、{ } 内が、いくつか空欄だったり、色設定が無かったりしますが、気にせず進みましょう♪）
黄色の文字「#fff」が五つあります、とりあえず全部同じ色にしちゃいましょう！
ちなみに「#ffff00」とすると黄色になります（ブログ投稿時の文字に色を付けるための番号を参照）
応用編「文字変更のまとめ」で更に詳しく！！

次に緑色の文字、これは文字サイズの変更です。単純に数字が大きいほど大きくなります。

残りの4色の文字は、タイトルの位置を変更する個所です。
ピンク色の「left」を「right」に変えれば、右側に表示され
青色の数字で、下からの高さを決めます。
オレンジ色、これは少し説明が難しいですが、タイトルの上　右　下　左に余白を作る設定で、微調整はここで行います。
最後の赤色、これは字間の設定です。

・・・とは言うものの、なかなか思うように行かないのが、この表示位置調整・・・この辺は、色々と数値を変えて「プレビュー」で確認しながら、頑張ってみてください！！


.description{
width:700px;
height:29px;
color:#fff;
line-height: 1.2em;
font-size:12px;
padding:0px 15px 0px 15px;
text-align:left;
letter-spacing:2px;
overflow:hidden
}
こちらは、紹介文の設定個所で、すぐ下にあります。
タイトルの設定の時の色による区別と、ほとんど同様です。
違うのは、黄色の「文字の色の設定」が一箇所だけであること。
もう一つが紫色、これは紹介文の表示幅の設定です。
表示幅が狭ければ、行数が増えます。

バランスを考えて、色々設定を変えて楽しんでみてください（＾＾）ｂ

Kawatombo Ken

この記事が役に立ったと思ったら・・・
ぜひご協力くださいm(__)m

にほんブログ村のランキングに参加中です！
一日一回ワンクリックお願いします♪