交互设计中心-72色

交互设计中心 | 用户体验 | 优化

CSS Sprites 将小图片整合到一起

2009年6月11日 | 分类:DIV+CSS | 评论:1 | 引用:0 | 浏览: | Tags:CSS Sprites  图片整合  

css中用一张背景图做页面的技术有什么优势?
就在于下面的介绍

简单介绍一下 CSS Sprites 的优点:
当用户往U盘中拷200张图片,会等很久。但是如果弄成一个文件,再拷贝就会快很多。

CSS Sprites 的目的就是通过整合图片,减少对服务器的请求数量,从而加快页面加载速度。

css-sprites

实现方法:

  1. 首先将小图片整合到一张大的图片上
  2. 然后根据具体图标在大图上的位置,给背景定位。background-position:-8px -95px; 当然也可以给定%。

原文出处:http://uicss.cn/css-sprites/

Share
« 精英只不过是IT民工,精英眼里的小白才是有钱人CSS Sprite样式生成器-网页制作缺她不可 »
  1. shen.li头像
    shen.li 2010-1-22 10:17:24 1

    你好,整合小图片的工具并生成调用的CSS代码,我想你推荐 CSS Satyr。

    chia 于 2010-1-25 9:15:38 回复
    谢谢 有时间研究研究,应该大同小异的软件把




◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。