サイドバーの1ポイント(バックグランドイメージはそのまま)
3列スキンのサイドバーのバックグランドを指定している方が、ワンポイントのイメージを追加したい場合の技です。
よろしかったら試して下さいね。
HTML編集でワンポイントの追加
HTML編集でワンポイントのイメージを指定します。今回の例は3列スキンですが、皆さんのスキンに合わせてご利用下さい。
HTML編集左側
<DIV CLASS=MNTTL_L><img src="イメージURL"><$mntitle$></DIV>
<DIV CLASS=MN_L><$mnbody$></DIV>
HTML編集右側
<DIV CLASS=MNTTL_R><img src="イメージURL"><$mntitle$></DIV>
<DIV CLASS=MN_R><$mnbody$></DIV>
CSS編集部分
/*左側*/
DIV.MNTTL_L{
background-image:url(イメージURL);
background-repeat:no-repeat;
background-position:left;
/*------------------ ここまで --------------------*/
/*右側*/
DIV.MNTTL_R{
/*------------------ ここから追加 ---------------*/
background-image:url(イメージURL);
background-repeat:no-repeat;
background-position:left;
/*------------------ ここまで --------------------*/
今日のポイント
- CSS編集とHTML編集を使用してイメージを2つ重ねています。
background-repeat
repeat 縦横にイメージを繰り返す
no-repeat イメージを繰り返さない
repeat-x 横方向にイメージを繰り返す
repeat-y 縦方向に 〃
background-position
画像の表示位置を指定します。値を横方向と縦方向の順に入力しスペースで区切ります。値の指定方法方はpxや%などで指定も可能です。今回の指定は横方向を左側に表示するように指定しています。
難易度:★