オリジナルスキンCSSの編集 コメント欄3
知らない間に桜が咲いていました
毎日通っていても余裕がないと気が付かないんですね・・・
こんな吹出しはどうでしょう・・・
CSSの最後にコピペしてください
#comment_module .each_comment{/*コメント背景画像上*/
margin: 0;
padding:0 0 10px 0;
background: url(画像のURL) ;
background-repeat : no-repeat;
}
#comment_module .comment_body{/*コメント背景画像中*/
text-align: center;/*コメント中央寄せ*/
margin: 0;
padding:0 15px;/*コメント分の左右の余裕*/
background: url(画像のURL ) ;
background-repeat : repeat-y;
}
#comment_module .comment_footer{/*コメント背景画像下*/
margin:0;
padding-top: 55px;/*画像の高さが目安*/
background: url(画像のURL) ;
background-repeat : no-repeat;
}
#comment_module .label{/*コメントタイトル*/
text-align: center;/*タイトル中央寄せ*/
font-weight: bold;
font-size:12px;
padding:10px 0 10px 10px;/*タイトルの位置*/
}
.comment_footer span.comment_author{/*吹出し部分に合わせるため名前を右に*/
padding-left:30px;
}
.comment_footer span.comment_date{/*名前と日付の間隔*/
padding-left:20px;
}
#comment_module .comment_footer{
border-top:none;
}
ゲストさまと自分のコメントを分けるためには
新・自分のコメントを "もっと"わかりやすく を、フリープラグインに設置する必要があります
素材 コメント欄 背景画像
横幅520pxと450pxのコメント欄背景画像です
使い方は 「オリジナルスキンCSSの編集 コメント欄」 へ
横幅395pxの画像はこちらにあります&CSSが使えない場合のやりかたもこちらで
横幅520px
![]()

横幅450px
オリジナルスキンCSSの編集 コメント欄2
今度は画像を使わないでやってみます・・・
本当はコメントについているクラスをブログ管理人と他の方と分けてもらえれば・・・
現在はclass="each_comment"コレを管理人のコメントにはclass="admin_comment"あたりにしてもらえれば
色を分けたりして一発で管理人のコメントだって判るように出来るですが・・・・・
ついでにトップで自分で書いたコメントは「コメントがあります」なんて出さないで・・・
他のブログではCSSで細工可能なところがありますがアメブロでは出来ません・・・・・
他にもニックネームの横にペタで使っているプロフィール画像のサムネイルなんかが
貼ってあったらいいとは思いませんか・・・?
以上、アメブロへの要望でした ( いまのところは実現不可能です )
で、今回はボーターと背景色を使います
色を設定したらCSSの最後にコピペしてください
※今回は探して削除は必要ありません
#comment_module .label{/*コメントタイトル*/
font-weight: bold;
font-size:12px;
color:#ff0000;/*タイトルの文字色*/
padding:10px 0 10px 10px;/*タイトルの位置*/
border-bottom:5px solid #66ffff;/*コメント上線*/
}
#comment_module .comment_body{/*コメント*/
margin: 0;
padding:10px 15px;/*コメント部分の上下、左右の余裕*/
background-color: #fafdfd ;/*コメント背景色*/
color:#66ffff;/*コメントの文字色*/
}
#comment_module .comment_footer{
border-top:1px solid #66ffff;/*コメント下線*/
}
.comment_footer span.comment_author{/*名前を右に*/
padding-left:30px;
}
.comment_footer span.comment_date{/*名前と日付の間隔*/
padding-left:20px;
color:#666666;/*日付の色*/
}
ゲストさまと自分のコメントを分けるためには
新・自分のコメントを "もっと"わかりやすく を、フリープラグインに設置する必要があります
