Css Sprite教程

Css Sprite和雪碧之间有什么关系?

Css Sprite和雪碧之间有什么关系?

大家看到Css Sprite这三个字一定会很好奇,它到底和雪碧之间有什么说不清道不明的联系呢?

1. 这些图片看起来也不像雪碧啊?

难道是这样:雪碧里面有很多的气泡,这些气泡均匀的分布在各处,而Css Sprite也是一些小图片均匀分布在各处,所以叫Css Sprite?

听起来似乎很有道理,但仔细想想在汽水领域里雪碧销量不如可乐,那为什么不叫可乐图呢?

你可能会想可乐是深色背景的,而雪碧则是透明的,刚好Css Sprite大多数也是透明背景的。嗯……听起来似乎有那么点道理。

2. 实际原因

其实真实的原因是因为雪碧的英文名字是Sprite,而Css Sprite的英文名是CSS Sprites,他俩同样都有Sprite这个词。

sprite


左边是雪碧在国内的 logo,右边是国外的 logo。


可以看到本来在没进入中国市场之前人家就叫Sprite(精灵),只不过进入了中国市场之后,中国区的负责人表示:用户去商店买汽水的时候如果对老板说:老板你这里有没有精灵?听起来就会感觉很奇怪,所以咱们不要被Sprite这个单词给限制住了,咱们应该起一个更符合中文语义的名字,于是乎“雪碧”诞生了。

而Css Sprite在国外叫做 CSS Sprite(CSS精灵)反正 Sprite 在国内被叫雪碧,那干脆不如咱们就叫它Css Sprite吧!——来自最先接触到这项技术的人。

所以后来接触这项技术的人也就跟随前人一起叫它Css Sprite了。

3. 小结

既然知道了Css Sprite为什么叫Css Sprite而不叫可乐或者啤酒图,那么接下来该去解决一下同学心目中的另一个疑问了?

为何要多此一举的把这么多张小图片集合在一起形成一张大图片呢?
就让小图片安安静静的躺在那里不好吗?

那么接下来的章节我们就带领大家去探索Css Sprite的妙处。

返回顶部