前端快速切图方法

 

   我的认为切图虽然不是前端的主要工做,但掌握一些切图的技巧仍是有利无害的。html

  切过图的小伙伴确定对传统切图方式很反感。由于真的很麻烦,要一张一张的切。前端

  要切的图少还好,多了简直就是噩梦,特别是当用PS提供的参考线辅助切图的时候,密密麻麻的参考线简直眼花缭乱。工具

 

  后来 photoshop 2014 CC 版本开始提供了2种方法辅助切图。性能

 

   第一种:打开PS之后选择文件-脚本-将图层导出到文件,而后会弹出下面界面spa

  注:若是是 photoshop 2017 CC 版本的,选择文件-导出-将图层导出到文件htm

  

 

   选择你要的图片格式,而后选择运行便可。随后PS会开始自动切图,简单方便blog

   但过程耗时很长,特别是对电脑的性能有很高的要求,然而切出来的图能用的也很少。我的感受很鸡肋的一个功能图片

 

  第二种方式 (推荐这种)
资源

  打开ps后选择首选项(快捷键crtl + k)增效工具,而后弹出以下界面  get

 

 这里必定要勾选启用生成器选

 

 同时选择文件-生成-图像资源(这个时候桌面上会自动生成一个文件夹,用于存放切好的图)

 

 

 重点来了,作好上面的准备之后,只须要选中要切图的图层,而后双击图层,把名字改成如,logo.png回车便可

 而后就能够在桌面上自动生成的文件夹里看到刚刚切好的png格式的图,jpg也是如此

 

 

 若是你要切苹果的2@,3@图,一样双击图层后输入 200% 2@logo.png / 300% 3@logo.png 便可自动生成到桌面的文件夹里

   

  

 注:这2种方式都须要photoshop CC版,建议使用photoshop 2014 CC版及以上版本

 

  不过上面的方式仍是费时间,后面我发现了一款切图神器,

  写了一篇博客,详情:http://www.javashuo.com/article/p-ojunfawe-cn.html

相关文章
相关标签/搜索