「前端眼中的PS」测量及取色

• 测量
  • 选框工具的多用途
• 取色

---

测量

所有能接受数字的属性都需要测量并尽可能百分百的还原设计稿。

• 宽度，高度 (width, height)
• 内外边距 (padding, margin)
• 边框 (border)
• 定位 (position)
• 文字大小 (font-size)
• 行高 (line-height)，其为第一行的底端到第二行的底端。
• 背景位置 (background-position)

tips:测量时尽可能放大画布以减少误差。量取文字是为了减少误差尽量选取尺寸大的文字进行测量。

photoshop-measure&colorSelection.png

选框工具的多用途，增（Shift）减（Alt）以及交叉选择（Shift + Alt）。左右（或上下）使用分离选框选择可以得到整两个分离边框的距离总值。

[图片上传中...(photoshop-measure&colorSelection.png-936a30-1536738864055-0)]

取色

所有能接受颜色的属性都需要取色。

• 边框色
• 背景色
• 文字色

tips：

• 可以使用魔棒工具来判断颜色是否为渐变。
• Mac OS X 推荐使用 Sip 可在 Mac App Store 免费下载。