TAK.のブログ一覧

　　

何とか活用したいねぇ。

師匠のブログを参考に久々にスタイルシートをいじってみた。

これで少しはスッキリしたかな。





【追記１】
　・フッターの画像変更
　・©2009 Carview Corporation All Rights Reserved. の位置変更と調整

【追記２】
　動作確認は毎度の如くIEのみ（＾＾；
　今回の処理が反映されないブラウザ…Firefox、他情報提供プリーズｗ

英字フォントを弄ってみた。



【追記】

ＡＡが崩れるので戻しました（ノ∀｀）

新規追加されたヘッダーの位置を動かしてみた。

もう少し見栄え良くしたいな。






【追記】
　ＩＥ以外の一部ブラウザでは正確に表示されないらしいｗ

　　OK…GoogleChrome
　　NG…FireFox、Opera、Safari

Zen君からヘッダー画像のことで質問があったんだっけ。
すっかり忘れてたw

師匠の受け売りになりますが、自分なりに説明をば。


以下、太字部分はスタイルシートから抜粋。

まずはベースとなるヘッダー画像を用意。

#Header
{
padding:15px;
margin-top: 5px;
background: #353535;
margin-bottom: 0px;
width: 745px;
height: 325px;
background-image: url('http://画像URL.jpg');
}

次に "BlogTitle a" "BlogTitle a" を探す。
ブログトップへのリンクを消し、画像の任意の位置にリンクボタンを設ける。
わしんとこの場合、下記のように設定。

.BlogTitle
{
font-size: 20px;

}


.BlogTitle a
{
　　　　　text-indent : -1000px;

　　　　　display:block;

margin: 50px 325px 226px 52px;

width:251px;
height:49px;

}

　　text-indent : -1000px; ブログタイトル文字非表示
　　display: 指定方法→ブロック要素
　　margin: マージン（余白）　※数値は上右下左の時計回り
　　width: ボタンの横幅
　　height: ボタンの高さ





こんなとこかいのう。