北京治疗白癜风哪家最好 https://wapyyk.39.net/bj/zhuanke/89ac7.html
在网页设计中，精灵图指一张整合了很多个小icon图表的大图片，作用主要是为了有效减少服务器接收和发送请求的次数，提高页面的加载速度。精灵图也称作CSSsprites、CSS雪碧等。二倍精灵图是指将原精灵图缩小一倍的精灵图，主要目的是使用原精灵图显示，在网页对应位置过大而进行了缩放，二倍精灵图过大，也可以设置三倍精灵图，过程与设置二倍精灵图一致。
很多初学者不知道如何设置和定位二倍精灵图，本教程向大家详细讲解这个设置过程。
一、设置二倍精灵图
1.打开PS，将精灵图导入PS中
2.将原精灵图缩放至原图的一半像素，如原图xpx，修改为xpx
3.保存图片，二倍精灵图处理完成
二、在CSS中定位相应icon
假设需要将上图的H、T、M、L取出，展示在网页上
1.编写HTML
2.编写CSS，关键是如何找到所需图标的精确位置
3.以上标红的坐标位置如何找到的呢？
打开PS，按F8调出像素信息框，将鼠标移动到所需icon的左上角，显示出的X、Y坐标即为精确位置，然后根据页面显示效果在CSS中稍作调整。
4.最终，成功取出自己想要的icon，页面展示效果如下