如何在评论输入框textarea中加入背景图片

在评论输入输入框中，显示一张图片而又不影响文字的输入，其实就是在textarea中加入背景来实现，一般来说，为了好看，当访客进入网站之后，点击textarea时候，背景图片就得消失，所以一共加起来，在评论输入框textarea中加一张图片就包含了以下两个部分。

一、加入背景图片

以本网站为例，找到控制textarea的样式表内容，添加的内容，我已经加粗。

notes .comment-post #comment {
background: #fefefe url(img/comment.gif) no-repeat center;/*控制留言的文本框的背景图片*/

URL中必须写明背景图片的相对路径哈，例如img/comment.gif,如果背景图片都木有，谈啥呢？你的图片不动，怪你自己不弄个能动的GIF啊。

下图就展示了这个效果

还不知道怎么做？直接写到你的html标签里吧，还是不会，哈哈，找一个谷歌浏览器，打开你的网页，找到你的评论留言的那个大框框，然后右键选择，“审查元素”，然后左边显示的部分就是你网站的textarea的HTML，右边则是样式表，，复制样式表中的重要内容，去你的样式表中找，找到之后，在相应的地方加上上面所说的代码。以下图片仅供参考做法。

二、当鼠标放入评论输入框textarea中时，让背景图片消失

这个就更简单了，你搜索"textarea背景消失"方法千万种，通过实现的方式也很多，现在只是说一种。

找到你的textarea标签，例如，里面加上下面加粗的代码段即可

<textarea name="comment" id="comment" rows="10" tabindex="4" onfocus="this.style.backgroundImage='url()';" >
</textarea>

这下当你的鼠标当进去的时候，背景是不是消失了呢？