2015年2月16日

自动化切图工具Cyotek Spriter


切图网 www.qietu.com:做web前端开发都应该知道css Spriter, 最早起源于网易163的邮箱,至少我最早是在网易邮箱上看到的,css Spriter就是把所有的碎图片拼到一张图片上,然后通过的css的background-position来定位背景图片的位置,这样的好处是减少了服务器的请求,可以加快网页加载速度,但是这种方式制作起来比较复杂,需要将切好的碎图拼到一起,还需要反复衡量图片的位置,再用css写背景图片的定位… 如果有一款工具可以自动化解决这个问题,那一定很棒,下面就是要介绍的这款工具Cyotek Spriter。

Cyotek Spriter是用来方便快速的切图的自动化工具,对CSS网页设计一窍不通也可以做到快速方便的切图处理。

网页切图除了要会基本的 HTML 语法之外,透过 CSS 更能设计网页风格,而一般人载入小图档时都是插入贴图标签,或是透过 CSS 载入图片,若是一个网站有数十个小图档,那用户端就必须对伺服器有 数十个请求,对伺服器也算是小小的负担,CSS Sprites 的技术就是在解决这的问题,将所有小图档合并成一张图,透过 CSS 来切图,让载入图档更快更有效率,对站长来说也是省资源的一种方式。这次所介绍的懒人工具 Cyotek Spriter 就替你轻松达成 CSS Sprites 的效果。

http://www.cyotek.com/cyotek-spriter

微信扫一扫二维码访问