您现在的位置:首页 --> 查看专题: Sprites
在分析各个网站的CSS时,我们经常可以看到一些网站有很多的元素共享了一张背景图片,而这张背景图片包含了所有这些元素需要的背景,这种技术就叫做CSS Sprites。这样做有什么好处呢? 显而易见,浏览器在载入每一张图片的时候都会发起一个HTTP请求。 如果使用CSS Sprites技术,将所有的图片合成一张图片,那么,这样多个HTTP请求会被合成一个HTTP请求。 这样就既能大大降低后台服务器的开销,又能加快网页载入速度。 CSS Sprites原理: CSS Sprites是通过背景图片外加背景图片定位来实现的。
Smashing Magazine 上面有一篇文章讨论了一下 CSS Sprites ,文章本身并没有否定这种技术的意思,但是提出了很多有价值的反面观点,做 Web Developer 的可以参考一下: 1. 浏览器默认会缓存所有的图片 2. CSS Sprites 要把很多图片组织在一起,会增加切图的工作量。 3. CSS Sprites 需要你编写很多定位代码,增加编码工作量。 4. 不容易维护。 5. 不是所有的图片都应该当做背景。很多时候要考虑到页面语义化,有些作为内容的重要图...
关于CSS Sprites技术的优化我们能做到多少,能减多少的请求数量。这并且不是单方面能做到的,一切取决于XHTML、CSS、CSS Sprites图片之间的配合。现时为止没有绝对优化的做法,这也是我在项目中经常衡量CSS Sprites图片与XHTML关系,如:《一张背景实现自适应九宫格》,以下总结了图片切割术与图象优化的一些方法。
[ 共4篇文章 ][ 第1页/共1页 ][ 1 ]
近3天十大热文
-
[86] memory prefetch浅析
-
[57] 基本排序算法的PHP实现
-
[50] 深入浅出cassandra 4 数据一致性问
-
[43] 转载:cassandra读写性能原理分析
-
[40] MySQL半同步存在的问题
-
[39] javascript插入样式
-
[38] Inline Form Labels
-
[37] JS中如何判断字符串类型的数字
-
[36] 字符引用和空白字符
-
[35] 获取Dom元素的X/Y坐标
赞助商广告