PhotoShop，CSS 文字间距 与像素之间的换算

最近遇到一问题，就是前端Web工程师按照设计稿上，字体大小一样但是实际显示效果和设计稿又不相同。

这是为什么呢？思考一下便得到了问题所在是字体间距行距的问题。然后具体锁定为间距的问题，因为行距只是关系到每行之间的距离而对每一行中字体相对位置没有具体关系，废话少说进入主题。

众所周知，ps设计行业字体单位有像素、点、傍 等单位，我们这里以像素为例子，而所谓的间距“-100、-75、-50、。。。。0、。。。。100”，这些其实是个相对关系和实际字体大小相关，文字字体越大实际间距也就越大，反之就越小。

实际像素大小 real_letter_spacing,(单位为px）

文字字号 font，(单位为px）

文字间距 spacing,

它们的换算关系为：

real_letter_spacing = font / 1000 * spacing

如果一段文字的字号为23px ， 间距为 100， 那么实际间距为 23px / 1000 * 100 = 2.3px。

从而得出前端字体间距设置2.3px方可与设计图效果一致，实际测试也是如此，stype =“letter-spacing:2px”;

ok至此大公告成。