css変更 ヘッダー文字調整 | TW復帰者のブログ

TW復帰者のブログ

オンラインゲーム Tales Weaver (略してTW) にこっそり復帰しました。数年ぶりのTWでの浦島太郎っぷりを書き綴ります。

前回、ヘッダーの画像を変更しました。


…黒に塗った画像を使ったので、

ブログタイトルの文字に画像がかぶって見えなくなっています汗


今度はどこをいじればいいか、cssをざ~っと見ます。

該当箇所を発見っ。


 /* (1-2) ブログタイトル文字
 --------------------------------------------*/


 /* skinTitle ブログタイトル文字 */
 .skinTitle,.skinTitle:visited,.skinTitle:hover,.skinTitle:focus{
 color:#000000;
 font-weight:bold;
 font-size:2.11em;
 }


 /* skinDescription ブログの説明文字 */
 .skinDescription{
 color:#333333;
 }


色が黒だから見えないので…

タイトル文字、説明文字ともに色を白にします。


 color:#000000; → color:#ffffff;


に変更です。


 /* (1-2) ブログタイトル文字
 --------------------------------------------*/


 /* skinTitle ブログタイトル文字 */
 .skinTitle,.skinTitle:visited,.skinTitle:hover,.skinTitle:focus{
 color:#ffffff;
 font-weight:bold;
 font-size:2.11em;
 }


 /* skinDescription ブログの説明文字 */
 .skinDescription{
 color:#ffffff;
 }


今度は白にした文字の位置をちょっといじりたくなりました。


/* skinBlogHeadingGroupArea タイトルと説明を囲うエリア */
.skinBlogHeadingGroupArea{
padding:20px 0 30px;
}


多分ここですね。

左右の距離(詰め物)の量を増やしてみます。

上はがばっと90px 左がもう少しあけたいので30pxにして 下は変更なし。


padding:20px 0 30px; → padding:90px 30px 30px;

/* skinBlogHeadingGroupArea タイトルと説明を囲うエリア */
.skinBlogHeadingGroupArea{
padding:90px 30px 30px;
}


ココは他にもっといいやり方もあるかもですが…見た感じ良いしb

ヘッダー部分の出来上がりです音譜


TWの内容?そのうち、そのうちに…