[tag:ProCSS逆引きCSS block.css]
block.css
/*--------------------------------------
左ブロック
--------------------------------------*/
/* ブロックタイトル */
div#leftblocks div.block-left h2 {
margin: 0 0 0.5em 0;
padding: 0;
font-size: 110%;
font-weight: bold;
}
/*--------------------------------------
右ブロック
--------------------------------------*/
/* ブロックタイトル */
div#rightblocks div.block-right h2 {
margin: 0 0 0.5em 0;
padding: 0;
font-size: 110%;
font-weight: bold;
}
方法
backgroundにcolorを指定する。
/* 左ブロックタイトル */
div#leftblocks div.block-left h2 {
margin: 0 0 0.5em 0;
padding: 0;
background: #色指定;
font-size: 110%;
font-weight: bold;
}
/* 右ブロックタイトル */
div#rightblocks div.block-right h2 {
margin: 0 0 0.5em 0;
padding: 0;
background: #色指定;
font-size: 110%;
font-weight: bold;
}
方法
backgroundにurl(画像パス)を指定する。
画像の表示はpaddingで表示領域を確保するか
heightの値を指定する。
/* 左ブロックタイトル */
div#leftblocks div.block-left h2 {
margin: 0 0 0.5em 0;
padding: 0;
height:高さ;
background: url(画像パス) no-repeat 0 0;
font-size: 110%;
font-weight: bold;
}
/* 右ブロックタイトル */
div#rightblocks div.block-right h2 {
margin: 0 0 0.5em 0;
padding: 0;
height:高さ;
background: url(画像パス) no-repeat 0 0;
font-size: 110%;
font-weight: bold;
}
方法
font-sizeの値を変更する。
/* 左ブロックタイトル */
div#leftblocks div.block-left h2 {
margin: 0 0 0.5em 0;
padding: 0;
font-size: 110%;
font-weight: bold;
}
/* 右ブロックタイトル */
div#leftblocks div.block-left h2 {
margin: 0 0 0.5em 0;
padding: 0;
font-size: 110%;
font-weight: bold;
}
defaut.cssでタイトル(見出し)でh2を指定したとしても
ここで指定するものが有効。
左右ブロックでpaddingを指定した場合はタイトルの長さは
それに準じる。
タイトルに左右ブロックサイズの長さが欲しい場合は
左右ブロックでpaddingを指定しない。
この記事にはトラックバック・コメントがありません。
サイト管理者はコメントに関する責任を負いません。