見えるところのちょっとしたお洒落
今度は見えるところにちょっとしたお洒落です。
図1のようにコメントを書くときにクリックする部分にプチアニメを入れます。
設置方法
CSS編集部分
DIV.POST_TAIL{
FONT : 11PX/150% TAHOMA;
MARGIN-TOP : 10PX;
TEXT-ALIGN : left; /*修正しました*/
/*--------------- ここから追加です --------------*/
background-image:url(ファイルURL);
background-position:left;
background-repeat:no-repeat;
padding:20px 0px 0px 0px;
/*余白を入れて画像が見えるように設定する*/
text-indent:30px;
/*-------------- ここまでです ---------------*/
}
今日のポイント
- background-imageで表示するイメージファイルを指定します。
- background-position:left;で左端に表示させます。
- background-repeat:no-repeat;でイメージを1つだけ表示します。
- padding:20px 0px 0px 0px;で上端部分を20px分入れてイメージがすべて表示されるようにしています。
- text-indent:30px;で、テキストの位置を30pxずらしてイメージと重ならないようにしました。
CopyRight(C) 2004 All rights reserved by potto37