Photoshop追踪转换为CSS字间距？

Question

3

在Photoshop中，文本跟踪设置为-2。

如果在CSS的字间距中将文本设置为-2px，则看起来与Photoshop中不同。如何将Photoshop的文本跟踪-2复制到CSS的字间距中？

我已经在网上寻找转换方法，但似乎不正确。

提前致谢！

- user2482397

2

Photoshop和HTML在不同的空间中使用不同的度量单位，因此这是相对正常的，通常没有快速解决方案。你能展示一些屏幕截图吗？展示一下你所拥有的内容以及你想要的效果。 - Pekka

也许它在pt中...尝试使用“-2pt”或“-2em”。 - tobspr

2个回答

2

我认为CSS中的letter-spacing应该是-0.002em。

以下是计算过程：

1000 = 1em; 
100 = 0.1em; 
10 = 0.01em; 
1 = 0.001em; 
-2 = -0.002em

- Hasibur Rahman

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Jukka K. Korpela · Accepted Answer

根据Photoshop教程，“Photoshop中的字距和字间距值基于1/1000个em”。文本追踪影响字符之间的间距，而不是单词。因此，在CSS中将文本追踪设置为-2的对应项应该是letter-spacing: 0.002em。

然而，在大多数浏览器中，这样做不会有任何效果，因为0.002em太小了。如果您的字体大小是几百点，则可能会看到一个像素的差异。在Firefox上，如果将该设置应用于长字符串，则可能会看到效果；Firefox可能使用像素的分数计算字符位置，因此即使很小的字距值也可以产生累积效果。

通常，您不应指望文本呈现的细节在所有浏览器中都相同，或者在浏览器中与Photoshop中相同。