◆ ヘッダー(スキン)画像を設定する
① 画像を繰り返しない
/* ------------------------------------------------------- */
/* ヘッダー(スキン)画像を設定 */
/* ------------------------------------------------------- */
.skinHeaderArea{
background-image:url(画像のURL);
background-repeat:no-repeat;/* 繰り返ししない */
background-position:center top;/* 位置 */
height:300px;/* 高さ */
}
② 画像を繰り返しする
/* ------------------------------------------------------- */
/* ヘッダー(スキン)画像を設定 */
/* ------------------------------------------------------- */
.skinHeaderArea{
background-image:url(画像のURL);
background-repeat:repeat;/* 繰り返しする */
background-position:left top;/* 位置 */
height:300px;/* 高さ */
}
◆ ヘッダー(スキン)の背景色
① 背景色を指定
/* ------------------------------------------------------- */
/* ヘッダー(スキン)背景色 */
/* ------------------------------------------------------- */
.skinHeaderArea{
background-color:#ffff00;
}
◆ ヘッダー(スキン)画像のロールオーバー
① カーソルを乗せた時の画像を設定
/* ------------------------------------------------------- */
/* ヘッダー(スキン)画像(ロールオーバー画像) */
/* ------------------------------------------------------- */
.skinHeaderArea:hover{
background-image:url(画像のURL);
background-repeat:no-repeat;/* 繰り返ししない */
background-position:center top;/* 位置 */
height:300px;/* 高さ */
}
◆ ヘッダー(スキン)画像をクリックした時にリフレッシュ
(自分のブログのホームに戻る)
① 画像をクリックすると自分のブログのホームに戻る
/* ----------------------------------------------------- */
/* タイトル・説明 削除(段落下)ブログタイトル範囲拡張 */
/* タイトルは、背景画像(ヘッダー)に入れること */
/* ----------------------------------------------------- */
.skinBlogHeadingGroupArea {
text-indent:-8000px; /* 1行目字下げ */
display:inline;
}
.skinDescription{
display: none; /* 表示しない */
}
.skinBlogHeadingGroupArea a{
display: block; /* ブロックレベルで表示 */
width:980px;
height:300px;
overflow:hidden; /* クリック時、点線が左に表示されないように */
outline:none;
margin:auto;
padding:0;
}
.skinHeaderArea2 {
padding: 0px 0 0px;
}