任何浏览器中的奇怪字体外观答案

【问题标题】：Wierd font appearance in any browser任何浏览器中的奇怪字体外观
【发布时间】：2013-08-31 18:29:06
【问题描述】：

祝大家有个美好的一天，我附上了 2 个屏幕截图（来自 Photoshop 和来自 google chrome） - 字体字符发生了什么变化？字体大小与 psd 中的相同，我也做了 css 重置（Meyer 重置，在那之前看起来更奇怪） - 可能有什么问题？你能帮我让它看起来像在 Photoshop 中一样吗？

提前致谢。

https://www.dropbox.com/s/zdg3k6a3rd49ygv/Desktop%2028-08-2013%2019-03-08-628.png https://www.dropbox.com/s/kszj0n1ql1jkfv7/Desktop%2028-08-2013%2019-03-15-829.png

代码如下：

article {
font-family: 'CaviarDreams', Arial, sans-serif;
font-size: 17px;
color: #ffffff;
font-style: normal;
}

和 Meyer 重置：css-tricks dot com/sn-ps/css/meyer-reset/

【问题讨论】：

Web 浏览器中的字体永远不会像 Photoshop 中的字体那样清晰。它们的渲染方式不同。关于外观（间距等），您至少需要发布您尝试使用的代码，否则我们将无法提供帮助。
所有你在 Photoshop 中为你的文本提供的疯狂的花哨效果都无法使用 css 复制，你可以通过添加一个微妙的文本阴影使其有点相似，但它仍然无法在 IE 中正常工作。
我没有使用任何效果，只是常规字体和#ffffff颜色。

标签： css text fonts photoshop appearance

【解决方案1】：

当您在 PSD 中检查字体时，字体的大小是多少，当您为浏览器设置样式时，您使用的字体是什么大小。

Photoshop 中的字体可能已使用抗锯齿和其他平滑效果绘制。作为一个跨所有浏览器的 Web 开发人员，实际上没有任何方法可以控制这一点。

Chrome 有一个 CS3 标签，你可以试试

-webkit-font-smoothing: antialiased;

【讨论】：

我刚刚发现这个问题只出现在 Opera 和 Chrome 中，IE 渲染很好，但是 webkit-font-smoothing 行没有帮助 - 已经尝试过了。
我知道字体字符是否看起来不像在 Photoshop 中那样平滑，但是当文本看起来很奇怪并且有点破裂时 - 这是不正常的。这里可能有什么问题？
你有没有使用 Font Squirrel 工具来生成字体 CSS 定义，它们可以在fontsquirrel.com/tools/webfont-generator找到它们
你也可以在stackoverflow.com/questions/11915288/…阅读previuios帖子