Photoshop中字体的单位

问题

第一个项目中UI设计师给的psd图字体单位是像素(px)，而且通常是整数；做第二个项目时，发现字体的单位是点(pt)，并且是小数。如下图所示:

字体工具栏-1.png 字体工具栏-2.png

点和像素的关系

• point
  点是一种标准长度单位，1 pt = 1 / 72 inch
• pixel
  像素是屏幕最小发光单位。
• ppi
  pixel per inch by diagonal 可简单理解为每英寸的像素数量。

将以上3个概念结合起来，1 inch 有72个pt，1 inch 有 PPI 个 px ;

1 pt = PPI / 72 px

PhotoShop 的默认PPI是72 , 在这种情况下 1pt = 1 px 。

• 在不同分辨率的PSD文件中，同样大小的点数，字体大小不同。
• 同样大小的像素，字体大小相同。
• windows系统默认设置PPI为96。
• mac系统默认设置PPI为72

设计图中字体存在小数点

• 第一，设计师使用了px为单位进行设计，可能采用了大于72dpi的分辨率。而前端攻城狮，通常并不会对自己的PS做首选项设置（通俗的说，就是设计师的设计文件中，字体以px为单位，而攻城狮使用PS打开文件的时候，默认字体以pt为单位。是的，一定是你的“打开方式不对~~~”），当单位由px转成pt的时候，是有可能变成小数的。

• 第二，设计师以pt为单位进行设计，而前端将pt转成px时，会出现小数。

• 第三，如果设计师使用了Ctrl+T，对文字进行了缩放处理，会出现小数点

PhotoShop 首选项设置

本人使用的是 PhotoShop CC

1. 选择菜单中的 首选项 -> 单位与标尺

   
   menu.png

2. 将红色方框中的文字单位设置为像素。

设置.png

。

参考

html5学堂-利利-揭秘PhotoShop中的点与像素
简书-阿树-前端工程师需要明白的像素
轻单-如何做跨DPI设计