6

Вопрос по html5, css – пользовательские шрифты с различными вертикальными метриками между ОС

Я пытаюсь добавить собственный шрифт для создаваемой страницы. Моя проблема в том, что вертикальное выравнивание шрифта выглядит по-разному на моей машине для разработки Ubuntu и на компьютерах с Windows.

Во-первых, вот изображения, чтобы понять проблему

Edit: unfortunately as a new user I cannot post images, so here is a description:

Проблема заключается в расстоянии между базовой линией шрифтов и элементом под ним. На моей машине с Ubuntu есть необъяснимый пробел, который не является отступом / полем. Даже если вы выделите текст, он выглядит смещенным.

Оба тестировались на Chrome, конечно же, один и тот же html / css (это та же страница). Отсутствие нижних полей / отступов как на коде, так и на инструменте инспектора хрома. Та же самая высота линии. Шрифт Museo. Оба загружают версию шрифта .woff. Любую другую информацию я с радостью предоставлю.

CSS для импорта шрифта:

@font-face {
  font-family: 'Museo-700';
  src: url('path-to-eot');
  src: url('path-to-eot?') format('embedded-opentype'),
       url('path-to-woff') format('woff'),
       url('path-to-ttf') format('truetype');  
}

Проблема сохранялась, даже когда я удалил объявление woff и ttf предоставлял шрифт.

Я действительно потерян с этим, понятия не имею, как я могу сделать это так же.

  • Ты это исправил для Антонио? Поскольку я сделал то, что предложил Петерри, заново создайте файлы различных веб-шрифтов с помощью & quot; Fix Vertical Metrics & quot; но такая же проблема сохраняется ...

    от
  • Большое спасибо! Решил и мою проблему с метрикой шрифта - до этого я явно использовал паршивый конвертер.

    от
  • Есть ли другой конвертер с параметром Vertical Metrics, кроме fontsquirrel. Поскольку это не позволяет мне конвертировать коммерческие шрифты.

    от
  • Я видел ваш комментарий слишком поздно, чтобы быть честным, но я уже использовал ваш генератор, и это решило мою проблему. Отличный инструмент, большое спасибо за предоставление его нам :)

    от Nikos Zinas
  • У меня была такая же проблема !!! ZOMG выпускает twinzzzz !!! Я думал, что я был единственным. У меня были проблемы со шрифтом:fontsquirrel.com/fonts/antonio

    от
  • Вы можете публиковать ссылки на изображения, и кто-то с большим количеством представителей может редактировать их в своем сообщении.

    от Sam DeHaan
  • 0

    Установите фиксированное значение, например, в px, для

    line-height собственность css.

  • 8

    Шрифты имеют три набора информации о вертикальных метриках. Один набор

    для Mac, один набор для ПК и другой набор, обычно используемый * nix. Их может быть сложно синхронизировать, но наш генератор шрифтов действительно пытается получить эти значения одинаковыми. Дай попробовать?

    http://www.fontsquirrel.com/fontface/generator

    Больше информации от команды типа Google:

    http://code.google.com/p/googlefontdirectory/wiki/VerticalMetricsRecommendations

  • 3

    У меня была такая же проблема с этим шрифтом:

    http://www.fontsquirrel.com/fonts/Symbol-Signs

    Я скачал предварительно упакованный комплект @ font-face, и показатели для Mac и ПК не совпадали.

    Решение состояло в том, чтобы извлечь шрифт TTF из загруженного набора и использовать его для экспорта нового набора @ font-face с генератором Font Squirrel. Генератор имеет флажок в настройках эксперта, помеченный как «Fix Vertical Metrics». Убедитесь, что это проверено, прежде чем создавать свой комплект.