当lang属性不是“ en”时，iOS中错误地显示了来自Google Fonts的Montserrat字体的西里尔字母

编程问答 2022-06-09

问题描述

初始设置：

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&amp;display=swap">

html {
    font-family: Montserrat,sans-serif
}

在[lang]设置为'ru'或任何其他值的情况下看起来很糟糕：

<html lang='ru'>

кириллические символы

将[lang]设置为'en'时看起来不错：

<html lang='en'>

кириллические символы

未设置[lang]时看起来不错：

<html>

кириллические символы

“ font-family：sans-serif”的外观如下：

кириллические символы

我仅在任何Web浏览器中的iOS 14.0.1的iPhone上遇到此问题（因为iOS上的所有浏览器均基于WebKit）。

它不能在macOS的Safari 14或任何其他浏览器上复制。

类似的问题：Cyrillic characters displayed wrongly when using Montserrat in Bulgarian

解决方法

在CSS中尝试

* {
  -webkit-locale: auto;
  white-space: normal;
}

为我工作

cyrillicgoogle-webfontshtml