您的位置:首页 > Web前端 > CSS

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

2012-08-16 22:02 225 查看
任何元素都可以加背景图,这是今天国新教会的。

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

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;
width:90px;
height:20px;
background:url() no-repeat x y;
}


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

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

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

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

一点小思考,不足一啃,欢迎批评指导
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: