HTML5教程

【十月打卡】第6天——切图基础教程-前端工程师版3-2

本文主要是介绍【十月打卡】第6天——切图基础教程-前端工程师版3-2，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！



https://img3.sycdn.imooc.com/633efa1d0001053c07290333.jpg

要把多张图片合并为为一张图片，减少打开图片的请求时间，提高网页打开效率。保存为web图，先把对象的图层隐藏掉，选择工具+Ctrl+点中不需要的底面。确保你的图全是格子的透明底，在进行保存。

https://img4.sycdn.imooc.com/633ef9e60001db5710760636.jpg


https://img1.sycdn.imooc.com/633efae2000177a207570324.jpg

https://img1.sycdn.imooc.com/633efdbd000142e202180119.jpg确保每个图选中，就把它进行一次全部选中的操作，


https://img4.sycdn.imooc.com/633efb660001389903880386.jpg

https://img4.sycdn.imooc.com/633efb740001610205080301.jpg

画布大小如上变化如上；

https://img1.sycdn.imooc.com/633efb8c00013d4806290488.jpg


这是用PS拼出来的一张图，保存好，这样做，所有用户图片或选中用户图片，效率比较低，太麻烦了。

应该用第三方工具，还可以把CS写好。



https://img2.sycdn.imooc.com/633efc1c000169e308710554.jpg

保存这个网站了。




https://img2.sycdn.imooc.com/633efc3c00019e0008210449.jpg


https://img2.sycdn.imooc.com/633efca70001ab9003850300.jpg



找到文件，是点按钮或者拖文件都可以。

https://img2.sycdn.imooc.com/633efcdd000118cb03520179.jpg



https://img3.sycdn.imooc.com/633efcfd0001975a06480262.jpg


左边是间距大小，默认是10；右边是放置的位置。

点个下载，你的雪碧图就搞好了。


这篇关于【十月打卡】第6天——切图基础教程-前端工程师版3-2的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航