ブログの練習

そら吉さんからのリクエストで、バナーの変更を練習しました。

今そら吉さんがご使用のテンプレートは　[ts-3-gray]Biz-Gray　です。

元々は、高さが１１０pxの画像をバナーに使っています。
そら吉さんが用意した画像が全部表示されないのは、このためです。

今のままでも十分カッコイイともうのですが
画像を全部表示するには、スタイルシートを少し変更しなくてはなりません。

変更箇所ですが

/* ヘッダー
================================================== */
ここの中の#bannerと.descriptionを変えます。

#banner
（変更前）
#banner {
margin-bottom: 1em;　
　　　　　　　　　　　　　　ここは変更します
　　　　　　　　　　　　　　　　　　↓　　　　　　　　　　　　　
padding: .8em 20px 1.8em;　　　　　　　　　　　　　　
background: url(そら吉さんのバナーのURL) repeat-x 0 100%;　　　　　　　　　　　　　　　　　　　　　　　　
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　↑
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　これを取ります　　　　　　　　　　　　


（変更後）　青い文字のところが変更箇所です。
#banner {
margin-bottom: 1em;
padding: 0px 0px 0px 10px;
background: url(そら吉さんのバナーのURL);
height:276px;
}


.description
（変更前）
.description {
color: #FFF;
width: 35em;
max-width: 700px;
overflow: hidden;
font-size: 93%; /* 12px */
line-height: 1.5;
}


（変更後）青い文字のところが変更箇所です。
.description {
color: #FFF;　　　　　　　　　　　　
padding:10px 0px 0px 15px;
width: 35em;
max-width: 700px;
overflow: hidden;
font-size: 93%; /* 12px */
line-height: 1.5;
}


これで、元々の大きさのバナーになると思います。


スタイルシートをいじる時は、自己責任でお願いします。