《CSS Sprites 图片整合技术》由会员分享，可在线阅读，更多相关《CSS Sprites 图片整合技术（2页珍藏版）》请在金锄头文库上搜索。
1、简单介绍一下 CSS Sprites 的优点：当用户往 U 盘中拷 200 张图片，会等很久。但是如果弄成一个文件，再拷贝就会快很多。CSS Sprites 的目的就是通过整合图片，减少对服务器的请求数量，从而加快页面加载速度。实现方法：1. 首先将小图片整合到一张大的图片上 2. 然后根据具体图标在大图上的位置，给背景定位。background-position:-8px -95px; “使用纯 CSS 实现未知尺寸的图片(但高宽都小于 200px)在 200px 的正方形容器中水平和垂直居中。”题目的难点在于两个方面：1. 垂直居中； 2. 图片是个置换元素，有其专有特性。 至于如何解决，
2、下面是一个权衡的相对结构干净，CSS 简单的解决方法：1. .box 2. 非 IE 的主流浏览器识别的垂直居中的方法 3. display: table-cell; 4. vertical-align:middle; 5. 设置水平居中 6. text-align:center; 7. 针对 IE 的 Hack 8. *display: block; 9. *font-size: 175px;约为高度的 0.873，200*0.873 约为 175 10.*font-family:Arial;防止非 utf-8 引起的 hack 失效问题，如gbk 编码 11.width:200px; 12.height:200px; 13.border: 1px solid #eee; 14. 15. 16.box img 17.设置图片垂直居中 18.vertical-align:middle; 19. 20. 21. 22.
