看到很多朋友的博客评论框里都有个背景图片，觉得很好玩，于是自己也加了一个上去。现在，诸位看官可以看看文章下面的评论框，会发现右下角有一张图片。搞定这个还是费了我不少力气的，下面把实现过程给大家讲一下（以我使用的Wordpress为例，其他博客程序大同小异）。当然，这对那些高手来说简直是小菜一碟。
首先找到评论框由什么代码控制的，通过查看源代码得知，是由textarea在控制，textarea本身有背景图片的属性，不过，现在都流行CSS，我们就用CSS来完成吧。
在我的博客中，评论框textarea的ID为comment（也有的把ID写成Class，是一样的），进入样式表（style.css），找到#comment附近的代码，可以看到原来的代码是：
#comment {width:90%}
用下面的代码替换掉上面的：
#comment {width:90%;background-image: url(http://www.wysls.com/upload/comment-bg.gif);background-repeat: no-repeat;background-position: right bottom}
说明：
1.在CSS样式表里需要找到的是控制评论框控件的ID或Clsss名字，我这里是comment，但不是每个人的都一样。
2.background-image后面跟的是背景图片的URL地址，绝对和相对的都行。
background-repeat属性表示是否重复，no-repeat为不重复，默认为重复。
background-position属性控制的是图片的位置，前面一个参数表示左右位置，后面一个表示上下位置，bottom的意思是向下对齐。
3.背景图片大小都可以，图片的背景最好是透明的，用PNG或者GIF格式。
本页面PR为: 1
Tags： CSS，代码，博客本文地址：http://www.wysls.com/2007/12/26/background-image.html
Trackback地址：http://www.wysls.com/2007/12/26/background-image.html/trackback
