CSS ヘッダー1 ではタイトルまで画像に合成してタレントブログのように画像クリックできるようにしてみました・・
今度はヘッダー画像だけを表示します・・ブログタイトルや概要はそのまま使います
このようなヘッダー画像を用意します（今回はブログの幅以下の横幅の画像を使います）
↑980px × 410px
/*ブログヘッダー*/
.skinHeaderFrame{
background-image:url(ヘッダー画像のＵＲＬ);
width:980px;/*Ａ*/
height:410px;/*Ｂ*/
margin: 0 auto 20px;/* 20pxＣ*/
background-repeat:no-repeat;
background-position:center;
}
.skinBlogHeadingGroupArea{
padding:0;/*ブログタイトル概要位置リセット*/
}
.skinTitleArea{/*ブログタイトル*/
margin-top:50px;/*上からの位置Ｄ*/
margin-left:80px;/*左からの位置Ｅ*/
}
.skinTitle, .skinTitle:visited, .skinTitle:hover, .skinTitle:focus{/*ブログタイトル*/
color:#ffffff;/*文字色*/
font-size:2.2em;/*文字サイズ*/
}
.skinDescriptionArea{/*ブログ概要*/
margin-top:10px;/*ブログタイトルからの位置Ｆ*/
margin-left:150px;/*左からの位置Ｇ*/
}
.skinDescription{/*ブログ概要*/
color:#ffffff;/*文字色*/
font-size:1.2em;/*文字サイズ*/
}
※ちなみに新しいデザインでは旧スキンのようにＣＳＳを入れなくても概要は改行されるって知ってました？