Chrome в Windows неправильно отображает «a with caron»

Question

У нас возникают проблемы с отображением маленькой буквы латинского алфавита a с caron (ǎ или U + 01CE) в Windows 10 - Chrome с семейством шрифтов Verana.Это показывает Caron рядом с буквой «а».Другие шрифты отображают его правильно.

Он отлично работает в Firefox и IE (под Windows / Linux / macOS) с Verdana.Также Chrome в Linux / macOS отображает это отлично.Комбинация Windows + Chrome + Verdana, кажется, единственная, которая испытывает трудности.

Например, отметьте Graphemica a с caron и поместите семейство шрифтов буквы примера в

font-family: Verdana

Если у вас Windows, она будет отображать невыше, но рядом с буквой «а».У кого-нибудь есть идеи, как мы можем это исправить для пользователей Windows Chrome?

Другие буквы с падежом, например: č (U + 010D) работает нормально.

Есть ли у кого-нибудь предложения?как мы можем позволить этому 'ǎ' работать в Chrome - Windows - Verdana без изменения шрифта?

Заранее спасибо.

Answer 1

Не отображается правильно, потому что U + 01CE отсутствует в Вердане.Компоненты (a, caron) оба присутствуют, но нет символа (или каких-либо правил компоновки OpenType), который бы объединял их в форму U + 01CE.Когда вы видите, что он «работает» в других браузерах, это происходит потому, что он заменяется резервным шрифтом, дизайн которого похож на Verdana (или он имеет небольшой размер текста, где вы не видите разницы).

Подробнее о Вердане можно узнать здесь: https://docs.microsoft.com/en-us/typography/font-list/verdana,, посмотрите раздел «Кодовые страницы».Ни одна из перечисленных страниц не содержит U + 01CE, поэтому шрифт просто не поддерживает этот символ.Другие символы, которые вы упомянули, находятся в Verdana.

Чтобы обойти это, вы можете использовать простой CSS, чтобы установить запасной вариант для этого конкретного юникода, например что-то вроде этого:

@font-face {
  font-family: "fallbackfont";
  src: local('Tahoma');
  unicode-range: U+0100-01FF;
}

<p style='font-family: fallbackfont, Verdana; font-size:72px'>a &#x01CE;</p>

ПРИМЕЧАНИЕ : я выбрал местный 'Tahoma' для отступления здесь, потому что его дизайн больше похож на Verdana, чем другие.И он выбран для использования для всего диапазона Unicode U + 0100-01FF.Но вы можете (вероятно, следует ) использовать веб-шрифт или другой локальный / "веб-безопасный" шрифт по вашему выбору.Кроме того, вы можете установить unicode-range только для одного символа, если вы уверены, что это единственный, который не отображается правильно для вашего текста.