● 内容
① 下記の様になります。
● 使用する画像の例
http://stat.ameba.jp/user_images/20140101/18/new-blue-777/e9/14/g/o0100002512800386062.gif
http://stat.ameba.jp/user_images/20140101/18/new-blue-777/f7/3e/g/o0100002512800386061.gif
● やり方
① 下記をＣＳＳの一番下に追加する
/* 記事フッター コメントする の画像 */
.articleCommentBtn {
background-image:url(http://stat.ameba.jp/user_images/20140101/18/new-blue-777/e9/14/g/o0100002512800386062.gif);
background-repeat:no-repeat;
background-color:transparent;
width:100px;/* 画像の横幅 */
height:25px;/* 画像の高さ */
border:none;/* 枠なし */
text-indent:-9999px;
padding:0px;
outline:none;
overflow:hidden;
}
.articleCommentBtn:hover {/* ロールオーバー画像 */
background-image:url(http://stat.ameba.jp/user_images/20140101/18/new-blue-777/f7/3e/g/o0100002512800386061.gif);
}
■ 追記
【2014.01.02 追記】
コメントするを中央に配置する。
（いいね！ボタンがある場合は、一緒に中央に配置されてしまうので注意）
/* コメントするを中央に配置する */
.articleCommentBtnArea{
float:none;
text-align:center;
}
.articleBtnSubArea{
float:none;
}
● 関連記事
記事下のコメントするの調整