コメント欄 横幅400pxと500px プレゼント

※今回のは上の画像と中の画像は同じ画像を使います

↓３カラムスキン用↓

　　　

　　　





　　　

　　　





　　　


　　　





　　　

　　　





　　　

　　　

　　　

　　　

↓２カラムスキン用↓

/*今回のは上の画像と中の画像は同じ画像を使います*/


↓３カラムスキン用ＣＳＳ↓

/* ゲストコメント　*/
#comment_module .each_comment{/*コメントタイトル部分*/
padding-bottom:15px;/*コメントとコメントの間*/
background: url(画像のＵＲＬ);/*上画像のURL*/
background-repeat : no-repeat;
background-position: left top;
color: #00008b;/*←ゲストコメント文字色変更の場合*/
}
#comment_module .comment_body{/*コメント文章部分*/
margin: 0;
padding:10px 60px 10px 10px;/*コメント分の上と左右と下の余裕*/
background: url(画像のＵＲＬ);/*中画像のURL*/
background-repeat : repeat-y;
background-position: left top;
}
#comment_module .comment_footer{/*コメントフッター部分*/
margin:0;
padding: 50px 0 5px;
background: url(画像のＵＲＬ);/*下画像のURL*/
background-repeat : no-repeat;
background-position: left bottom;
}
#comment_module .label{/*コメントタイトル*/
font-weight: bold;
font-size:12px;
padding:10px 0 0 10px;
color: #333333;/*←ゲストコメントタイトル文字色変更の場合*/
}
.comment_footer span.comment_author{/*名前の表示位置*/
padding-left: 10px;/*左からの位置*/
}
#comment_module .comment_footer{/*フッタ上の点線を消す*/
border-top:none;
}

/*　管理人コメント*/
#comment_module .admin_comment{
margin: 0;
padding-bottom:15px;/*コメントとコメントの間・・ゲストと同じに*/
background: url(画像のＵＲＬ);/*上画像のURL*/
background-repeat : no-repeat;
background-position: left top:
color: #0000ff;/*←管理人コメント文字色変更の場合*/
}
#comment_module .admin_comment .comment_body{
margin: 0;
padding:10px 60px 10px 10px;/*コメント分の上と左右と下の余裕　ゲストと同じに*/
background: url(画像のＵＲＬ);/*中画像のURL*/
background-repeat : repeat-y;
background-position: left top;
}
#comment_module .admin_comment .comment_footer{
margin:0;
padding: 50px 0 5px;
background: url(画像のＵＲＬ);/*下画像のURL*/
background-repeat : no-repeat;
background-position: left bottom;
}
#comment_module .admin_comment .label{/*コメントタイトル*/
color: #333333;/*←管理人コメントタイトル文字色変更の場合*/
}

↓２カラムスキン用ＣＳＳ↓

/* ゲストコメント　*/
#comment_module .each_comment{/*コメントタイトル部分*/
padding-bottom:15px;/*コメントとコメントの間*/
background: url(画像のＵＲＬ);/*上画像のURL*/
background-repeat : no-repeat;
background-position: center top;
color: #00008b;/*←ゲストコメント文字色変更の場合*/
}
#comment_module .comment_body{/*コメント文章部分*/
margin: 0;
padding:10px 110px 10px 70px;/*コメント分の上と左右と下の余裕*/
background: url(画像のＵＲＬ);/*中画像のURL*/
background-repeat : repeat-y;
background-position: center top;
}
#comment_module .comment_footer{/*コメントフッター部分*/
margin:0;
padding: 50px 0 5px;
background: url(画像のＵＲＬ);/*下画像のURL*/
background-repeat : no-repeat;
background-position: center bottom;
}
#comment_module .label{/*コメントタイトル*/
font-weight: bold;
font-size:12px;
padding:10px 0 0 70px;
color: #333333;/*←ゲストコメントタイトル文字色変更の場合*/
}
.comment_footer span.comment_author{/*名前の表示位置*/
padding-left: 100px;/*左からの位置*/
}
#comment_module .comment_footer{/*フッタ上の点線を消す*/
border-top:none;
}

/*　管理人コメント*/
#comment_module .admin_comment{
margin: 0;
padding-bottom:15px;/*コメントとコメントの間・・ゲストと同じに*/
background: url(画像のＵＲＬ);/*上画像のURL*/
background-repeat : no-repeat;
background-position: center top;
color: #0000ff;/*←管理人コメント文字色変更の場合*/
}
#comment_module .admin_comment .comment_body{
margin: 0;
padding:10px 110px 10px 70px;/*コメント分の上と左右と下の余裕　ゲストと同じに*/
background: url(画像のＵＲＬ);/*中画像のURL*/
background-repeat : repeat-y;
background-position: center top;
}
#comment_module .admin_comment .comment_footer{
margin:0;
padding: 50px 0 5px;
background: url(画像のＵＲＬ);/*下画像のURL*/
background-repeat : no-repeat;
background-position: center bottom;
}
#comment_module .admin_comment .label{/*コメントタイトル*/
color: #333333;/*←管理人コメントタイトル文字色変更の場合*/
padding-left: 70px;/*左からの位置*/
}

※管理人のコメントを分けるには「新・自分のコメントを "もっと"わかりやすく 」が必要です

画像はダウンロード後、自分のブログの画像フォルダーにアップしてから使ってください

画像の加工は自由にどうぞ

注意・・・画像のＵＲＬを入れるときサムネイル画像を指定しないようご注意ください