前端用到的PS切图

• 参考资料,简书
• 图层概念

需要掌握的几个要点

• 使用PS工具
• 测量与取色
• 切图
• 保存
• 图片优化也合并

---

• ps工具
  1.修改像素（编辑-首选项-单位与标尺）
  2.面板（窗口-工具/选项/信息F8/图层F7/历史记录）/*这些开启之后，就要保存下来。窗口 > 工作区 > 新建工作区 > 保存 */
  3.常用工具
  1）切图工具：移动工具（最上面）、矩形选框工具、魔棒工具、裁剪工具+切片工具、缩放工具 、取色器
  2）辅助工具：视图里面勾选，对齐标尺，显示参考线，就可以拉参考线了

• 测量和取色
  1）测量：矩形选框工具&信息面板
  2）取色：拾色器&吸管工具

• 切图
  1.修饰性图片：图标、网站的Logo,还有一些特殊效果的按钮、文字等以及非纯色的背景/PNG24/PNG8/
  2.内容型图片：内容性的图片一般我们应用在HTML标签 img 上,比如网站上的广告图片以及一些网站文章中的配图/存为JPG格式/

  - 适用于一刀切的图片：
      1）根据需要的区域，分别拉参考线；
      2）选择切片工具
      3）点击“基于参考线的切片”按钮
      4）保存（全选切片，选择存储为Web所用格式）
  

• 保存
  1）当图片色彩丰富无透明要求时，建议保存为JPG格式并选择合适的品质
  2）当图片色彩不太丰富时无论有无透明要求，建议保存为PNG8格式
  3）当图片有半透明要求，建议保存为PNG24格式

• 图片优化与合并
  降切下来的图片进行合并，使用在线合成雪碧图,网上搜索，可以自动生成CSS，PS上也可以操作，但是不好定位。