css - webkit 字体平滑 : suddenly different results in chrome and safari

标签 css fonts rendering font-face webfonts

我曾经在两个 webkit 浏览器(Chrome 和 Safari)中有相同的输出,但突然(我不知道我可以改变什么)在 Chrome 中的渲染看起来很糟糕。

这是我的html

<li class="cat-item term term-workshops"><a href="/workshops">Workshops</a></li>

这是我的CSS

.term a {
    display:inline-block;
    height:1em;
    -webkit-font-smoothing:antialiased;
    -moz-font-smoothing:antialiased;
    font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
    font-smooth:always;
}

.term-workshops a {
    text-transform:lowercase;
    font-family:"Custom-Family", sans-serif;
    font-size:1.4em;
    margin-top:.1em;
}

Safari 中的输出看起来不错(以前在 Chrome 中看起来一样)

SAFARI

Chrome 中的输出突然变得糟糕

SAFARI

知道为什么这会在两个 webkit 浏览器中产生差异吗? 我知道它在 Firefox 中看起来很糟糕,因为没有 font-smoothing 选项,但如果可能的话,它在 Chrome 和 Safari 中看起来应该是一样的。

我可以在我的 css 中更改什么,使输出看起来突然不同?我知道它在两种浏览器中看起来都一样!

最佳答案

https://productforums.google.com/forum/?fromgroups=#!topic/chrome/0vqp1bnkaoE

-webkit-font-smoothing no longer works. Google Chrome team intentionally changed this behavior. Seems font-smoothing wasn't applied "properly" on OSX in previous versions.

关于css - webkit 字体平滑 : suddenly different results in chrome and safari,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12646592/

相关文章:

java - 在未设置的 android 字体上使用 iText

delphi - 如何以编程方式更改 Firemonkey 控件中的字体属性

javascript - "Long frame times are an indication of jank"

macos - 我应该如何同步两个 NSView 的渲染内容?

jquery - CSS 或 jQuery 获取具有某种类型的第一个 child 的元素

javascript - 实现流畅的 JS tile 界面

html - CSS 页脚背景

jQuery:仅当单击父 div 时才淡出

fonts - 如何使 Font Awesome 图标变大?

javascript - ReactJS - 使用不同的数据重新渲染相同的组件?