以前注意到在雨林木风论坛，有一个很简单但是很人性化的细节：在用户没有填写评论时，文本域（textarea）显示一幅背景图片，提示用户一些注意事项，而当用户准备填写评论，将鼠标焦点移入文本域时，背景图片消失，显示纯白色的背景，防止干扰用户的视线。

在Wordpress中，可以这样实现：

1、打开当前主题的comments.php文件，找到<textarea name=”comment” cols=”50%” rows=”8″ id=”comment” class=”com-a”></textarea>这段代码。

2、然后打开当前主题的style.css样式表，找到com-a类的定义。将com-a定义复制一份，命名为msgfocu。如果没有com-a定义，则直接创建一个空的msgfocu类声明就可以。比如：


.msgfocu {
}

3、将需要的背景图片（msg_box_bg.gif）如放到主题的images目录下，然后在msgfocu中添加：

background-image: url(images/msg_box_bg.gif);
background-repeat: no-repeat;
background-position: center center;

针对于我这个主题，样式表中就多了这么一项定义：


.msgfocu {
width: 520px;
padding: 10px;
height: 300px;
font-size: 13px;
line-height: 18px;
color: #000000;
margin-top: 5px;
border: 1px solid #CCCCCC;
background-image: url(images/msg_box_bg.gif);
background-repeat: no-repeat;
background-position: center center;
}

4、将comments.php文件中的代码从 <textarea 直到</textarea>替换成：


<textarea name="comment" cols="50%" rows="8" id="comment" class="msgfocu" onfocus="this.className='com-a';" onblur="(this.value=='')?(this.className='msgfocu'):'com-a'"></textarea>

5、大功告成。

具体效果可以在下面评论试试。
（本博客已经更换评论系统）