CSS图片整合

一、什么是图片整合技术(css sprites 或者精灵图)
css sprites直译过来就是CSS精灵。通常被解释为“CSS图像拼合”或“CSS贴图定位”。其实就是通过将多个图片融合到一张图片里面,然后通过CSS background背景定位技术(background-position)技巧布局网页背景。
二、图片整合的优势:
若干小图标拼合成一张图后布局,减少http iis请求数,对于大战大流量网站来说隐形优势很显然的,从而隐形地提升了网站性能。对于大流量网站来说本来http请求数比较宝贵,使用DIV+CSS Sprites这样可以大大的提高页面的性能,这就是CSS Sprites最大的优点,也是其被广泛传播和应用的主要原因,同时也减少图片文件数目。
概括来说就是以下这两点
1)通过图片整合来减少对服务器的请求次数,从而提高页面的加载速度。
2)通过整合图片来减小图片的体积。
三、CSS Sprites的实现方法:滑动门技术
1.什么是滑动门
滑动门是一个形象的称呼,它利用CSS背景图像可层叠性,并允许彼此之间滑动来创造一些特殊动态效果
2.滑动门特征:
通过滑动门技术,可以使CSS设计出来的导航菜单兼具传统布局的图像效果,与CSS布局的高效拓展性。

你可能感兴趣的:(CSS图片整合)