拿 PSD 切图时，如何快速准确地知道各区域的大小？

[jmyz0455]

我一直都是拿 Photoshop 来切图的，比如说有个图片我想知道它的长宽，我就右键图层或组-复制-新建文件，然后在新文件里裁切透明部分，在查看画布大小，我就知道这个图片准确的大小了，但是这个方法效率很低，而且有很多空白间距都不能知道它的实际大小，我只能用选取工具把空白部分框住，这下选择框上就会有宽高的像素大小显示，但是这个方法效率依然很低，且不一定准确。

请问各位是如何快速准确地知道各图片、空白区域的大小、距离的呢？

[jmyz0455]

@swift 额，看来得跟设计师好好沟通一下啊

[jmyz0455]

@honk 经常这样很累的...

[jmyz0455]

@lwbjing 哈哈

[jmyz0455]

@immjun 那空白的地方呢？

[jmyz0455]

@moosoome 选取了之后按什么看信息

[jmyz0455]

@lijsh 你公司的 GG 真好

[jmyz0455]

@tmplinshi 上面推荐的几个工具更快~

[herozzm]

@jmyz0455 PS 自带的工具：切刀，据说专为网页切图准备

[scg16]

Assistor PS

[haiyon]

说下自己切图时的过程 （ PS 模式）

1. 移动工具下 右击 选择要切的图片（多个辅助 Shift 健，图层分组情况下会不好定位，注意下即可）然后 cmd ／ ctrl + e 合并。 碰见形状图层建立个空白层辅助合并
2. 合并完成后 cmd ／ ctrl ＋ a 全选，（不想新建文件的情况下在全选后按上下左右键（随便一个）蚂蚁线会包上合并的图）蚂蚁线会选中整个画板然后 cmd ／ ctrl ＋ C ， cmd ／ ctrl ＋ N ， cmd ／ ctrl ＋ V ，好了现在就是最终图片结果，想看尺寸 cmd ／ ctrl ＋ a 一下，在按下 F8 想要的信息都有了。

3. 最后看完想要的信息了， cmd ／ ctrl ＋ alt ＋ shift ＋ w 导出 web 格式。。。。

嗯，上面过程基本可以满足大部分的需求了
另：别觉得复杂哈，对 ps 熟悉的话这是很快的，嗯 自己这么认为

[newbieo0O]

点中要查看的图层， ctrl + t, 然后 F8

[xuelaistar]

1.面板里把信息面板调出来，如果图片是单一图层且标准的话， ctrl/command+T 选中信息面板就有宽高了
2.非单一图层量间距空白区域我用的类似你的方法，这个把图放大量的就比较准啊

[an168bang521]

- 如果是想知道图片的大小， ctrl+鼠标单击图层的图标； F8 调出信息面板就可以了；还有一种简单的就是打开智能参考线，鼠标移上去就可以了，还可以看到距离周边的像素；

- 如果是为了看尺寸， PS 基础不怎么好，把文件生成 jpg ， png 等都可以，然后用像素大厨或者别的软件，自己把想要的标好，然后根据自己标好的看一下就 OK 了；（比用智能参考线还省事）

- 如果你最终目的，还要把一个网页内所有图片切出来，那就更简单了，可以用 PSCC ，把想要的图片按照规范命名好，然后单击生成图片资源，所有的图片都自动切好， PS 会自动放在同层文件夹里了（ assets 结尾的文件夹）；

[jmyz0455]

@haiyon 快捷键不复杂，但是有些步骤我不是很懂：
[选择要切的图片（多个辅助 Shift 健，图层分组情况下会不好定位，注意下即可）] 这个 Shift 是什么意思怎么用的，我按着 Shift 然后点鼠标没有用呢？


我的是 Photoshop CC 2015.5 ， Windows10 里 ctrl ＋ alt ＋ shift ＋ w 是 [导出为] ，那跟 ctrl ＋ alt ＋ shift ＋ s 弹出来窗口左上角的标题写着 [存储为 Web 所用格式（ 100%）] 有什么区别？我想知其然知其所以然，谢谢

[jmyz0455]

@herozzm 你说的切刀是按 C 快捷键里的“切片工具”？

[jmyz0455]

@an168bang521 我找不到生成图片资源这个选项的？

[jmyz0455]

@immjun 信息面板里面没有宽高啊，倒是点击图层后按 Ctrl + T 才会有

[haiyon]

@jmyz0455 按住 Shift 键时配合鼠标右键会出来图层选择，主要作用是多选。存储为和导出 web 格式区别在于后者会往最小了压缩图片

[jmyz0455]

@haiyon 哦哦，明白，那我第二条问题呢

话说

[haiyon]

@jmyz0455 刚才手机码字，句号后面那句的意思是我刚才理解成存储为，和导出 web 格式，嗯，这句是纠正。。。
看你用的 PS 版本导出为和存储为 web 格式的区别是 前者可以生成不同尺寸，如：一个图标本来是 18 * 18 你可以在里面设置 在导出一份 36*36 的也就是 @2x ，这好像是 2015 新增的功能，请参考 Sketch 里的导出。后者是传统的导出 web 格式，区别就是一个可以多份，不用重复操作，一个需要一次一次导（可能还要涉及到改资源尺寸）