css 任何元素都可以加背景图

任何元素都可以加背景图，这是今天国新教会的。

有了这个我们可以做什么呢？

1. 一张大图，上面有一个小图标就我们想显示的，作为input校验正确后的提示

用img也可以用css sprites，但是不给img加src的话，你的img中间还会有个小图片，而且img的边框尝试许久也去不掉

还有一点，没有src的img，虽然在css里设置了width,height，但在FF里却因为没有width不显示，IE下显示，世界真奇妙

其实可以将图片作为span的背景，避免了以上两个问题。

span.rightImg{
    vertical-align:middle;
    display:inline-block;
    90px;
    height:20px;
    background:url() no-repeat x y;
}

 

。。。本来是想用span的，行内元素的inline-block更强大一些，但不知道博客园的html编辑里为什么不让用span。

为什么不切个图直接用img呢？因为本人不会用ps，有什么资源就是什么资源。而且如果是一个校验信息的span里的内容，反复的加载一个img元素会不会有流量呢？这个暂时不考虑吧。span里加一个无边框的img，你试过吗？

2. 我们还可以为图片设置背景图片，这有什么用？

我们可以把一张较小的图片作为用户的默认头像，等分辨率高的用户头像加载完成后再显示高清头像。

一点小思考，不足一啃，欢迎批评指导