【css spirte】合并拼图成一…

来源:互联网 发布:云计算需要学什么课程 编辑:程序博客网 时间:2024/05/29 09:40
这边不多说,只给大家推荐使用一个工具css satyr,直接百度下这工具到处都有了哈,
直接把图片拉到这软件里会把图片拼接起来,生成后同时会生成图2类似的css定位背景图,开发就不用自己去算像素了,大大提高spirte开发的工作效率,
css spirte优点:
1、最大限度的提高了网站图片的加载时间并减少了连接次数
2、可以做成多个版本,针对屏幕加载不同的spirte图片
3、对于修改图片质量,也是非常方便的不用一一张张图片去修改图片质量只要修改一张spirte就可以了,做为网页工程师不能不把网络访问速度考虑进去,图片大小直接影响网站打开速度,尤其是做手机webapp的工程师,大家都很在乎那10几kb或者上百kb的流量的,有的一张图片好几m,手机app根本用不了那么大

缺点
1、自适应大小问题,只有在支持css3的浏览器上使用,手机是都支持css3的,主要是要用到background-size,
2、要做背景垂直居中或者横向居中的用此方法要注意写法,这边不多介绍,这方法只适用于那些固定宽高的图片合拼
3、手机开发webapp的时候用js判断一个屏幕大小来等比例缩放或者放大spirte图片,同时也修改定位的比例像素值如果需要js可以点击下面链接查看手机js自适应大小的spirte
【css <wbr>spirte】合并拼图成一张图片,减少网络连接次数,css网络加载优化,

【css <wbr>spirte】合并拼图成一张图片,减少网络连接次数,css网络加载优化,


0 0
原创粉丝点击