在网站看到的图片可以像文字一样随意改变颜色的图形，其实它本身就是一种文字，只不过这些文字并不是我们平常所使用的各种字体的文字，它是一种图标文字，是设计师们使用“专用字符编辑程序”而创建的图标字体，这样就可以使用CSS更改所谓的图片（即图标文字）的颜色。
[html] view plaincopyprint?<div class="smail">
<em class="status">我很高兴 </em>
<em class="status unHappy"> 忧郁</em>
</div> .status:BEFORE {
color: red
content: "☺"
font-size: 22px
font-style: normal
left: 0
position: absolute
top: 8px
text-align: center
width: 21px
}
.status {
display: block
font-size: 11px
line-height: 12px
margin-bottom: 20px
padding: 2px 0 2px 26px
position: relative
}
.unHappy:before {
content: "☹"
color: blue
font-size: 22px
}
需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的<style>标签中，输入css代码：body{background: url(image.jpg) no-repeatbackground-size: 200px 200px}。
3、浏览器运行index.html页面，此时背景图片成功被设定为200*200。
