Подтвердить что ты не робот

Font-Smoothing в Firefox

Используя Google WebFonts ( "Освальд" в этом случае), я обнаружил, что мои шрифты становятся более смелыми, чем они должны быть. Я решил эту проблему в браузерах на основе webkit, используя:

-webkit-font-smoothing: antialiased;

но в Firefox я не могу найти декларацию, которая управляет этим. Я слышал об использовании взлома text-shadow, чтобы исправить это, но я бы предпочел не использовать его, поскольку он, без сомнения, изменит геометрические свойства шрифтов.

Вот как это выглядит в webkit (Chrome):

Chrome looks good

Это блочный ужасный рендеринг благодаря Firefox:

Firefox ugly

Я знаю, что есть способ достичь этого в FireFox, потому что я нашел этот шрифт на font-combinator.com, и он корректно отображает шрифт-комбинатор с помощью Firefox. Вот как это выглядит на Firefox через font-combinator.com:

on Font-combinator.com using firefox

После просмотра css, используемого для создания комбинатора шрифтов, я нашел это объявление: text-rendering: optimizelegibility;, но это не работает при применении к моему элементу.

Я также пробовал:

text-rendering: optimizeLegibility;
text-rendering: geometricPrecision;
font-smooth: always;
font-smooth: never;
font-smoothing: antialiased;
-moz-font-smoothing: antialiased;

Как я могу заставить Firefox сгладить мои шрифты, чтобы они выглядели правильно, когда отображались? Можете ли вы найти декларацию или комбинацию объявлений, которые отображают их на веб-сайте www.font-combinator.com?

Я использую относительно старую версию FireFox (16.0.2), потому что на этом компьютере установлена ​​старая версия OSX.

4b9b3361

Ответ 1

Это проблема только с Firefox по OSX...

Я только что ответил на этот вопрос: Как сгладить текст SVG в Firefox с возможным решением проблемы.

Я думаю, вы могли бы использовать следующий атрибут:

-moz-osx-font-smoothing: grayscale;

Это будет выпущено с помощью firefox 25 (ночная сборка может быть найдена в http://nightly.mozilla.org/)

Ответ 2

Вы пытались объявить численный вес шрифта вместо "обычного" или "жирного"? Там много различий в рендеринге веб-сайтов в разных браузерах.

Попробуйте установить {font-weight: 400;} для обычного текста и {font-weight: 700;} для жирного шрифта.