3

我正在尝试让 firefox 和 chrome 正确渲染位图字体，但无论我做什么，它们总是在某种程度上消除锯齿文本。我正在使用总站，从 TTF 转换为 WOFF 并包含在 CSS 中的 @font-face 中。这是我想要的样子：

（关联）

但这就是它最终的样子（在 Chrome 中，Firefox 大致相同）：

（关联）

如果你仔细观察，你可以看到轻微的抗锯齿。这是相关的CSS，所有尝试阻止它都无济于事：

body {
  font-family: terminus, monospace;
  font-size: 12pt;
  color: #746C48;
  font-smooth: none !important;
  -webkit-font-smoothing: none !important;
  -webkit-text-stroke: none !important;
  text-shadow: none !important;
  -webkit-backface-visibility: hidden !important;
  -moz-backface-visibility:    hidden !important;
  -ms-backface-visibility:     hidden !important;
}

和@font-face：

@font-face {
    font-family: "terminus";
    src: url([omitted]) format('woff');
}

谢谢！

4

0 回答 0