如何在评论输入框 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>

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