给WordPress博客评论框添加个性背景图片

RT!看见别人博客的评论框有个漂亮的背景图片,我也想弄个,不过先记下来,留着参考
这个方法我是通过百度找的,分享一下。

1、首先用PS弄个自己喜欢的图片(628*160,或者根据自己的评论框大小自定义)。上传图片到自己的网站,并记下图片的地址。
2、找到你现在用的主题的评论文件comment.php,评论框是用textarea代码来控制,并且textarea文本区域对应的CSS样式表ID为comment,打开style.css里查找#commentform textarea,这就是定义评论框的样式的。
我现在用的主题里的是:
.comments #commentform textarea {padding:0;color: #111;width: 658px;border: 1px solid;border-color: #a1a1a1 #c9c9c9 #e5e5e5 #c9c9c9;}
在上面代码的.comments #commentform textarea {后面加上代码:
#comment {width:628px;background-image:url(图片地址);background-repeat:no-repeat;background-position:right bottom;}
加上代码后就是
.comments #commentform textarea {width:628px;background-image:url(./image/comment1.png);background-repeat:no-repeat;background-position:right bottom;padding:0;color: #111;width: 658px;border: 1px solid;border-color: #a1a1a1 #c9c9c9 #e5e5e5 #c9c9c9;}
PS:width:628px是图片的宽度,到时候根据自己的图片宽度自定义,图片地址就是我的图片的地址。
background-repeat:no-repeat;是指拉大评论框图片不重复出现;
background-position:right bottom;是指图片与评论框的右、底对齐。

本文共 7 个回复

发表留言,喵!