html - 在保加利亚语中使用蒙特塞拉特时西里尔字符显示错误-6ren

html - 在保加利亚语中使用蒙特塞拉特时西里尔字符显示错误

转载作者：行者123 更新时间：2023-12-04 13:59:19

使用 Montserrat 时Google Fonts 中的字体并将 HTML 语言设置为保加利亚语，某些字符在某些浏览器中显示错误。

当使用另一种字体(例如 Roboto )或保留浏览器的 native 字体时，文本会正确显示。

当设置另一种西里尔语言(例如俄语)时，字符也能正确显示。

Montserrat 声称支持西里尔文和扩展西里尔文。

我们没有本地安装的蒙特塞拉特副本。

使用扩展语法 ( <link href="https://fonts.googleapis.com/css?family=Montserrat&subset=cyrillic,cyrillic-ext,latin-ext,vietnamese" rel="stylesheet"> ) 包含字体不会产生任何区别。

这是怎么回事？

由于客户和 CMS，我们无法轻易更改字体或语言。

使用保加利亚语，蒙特塞拉特中的字符显示不正确:

使用俄语，字符可以在任何地方正确显示:

我们进行了以下测试:

Windows 10 Enterprise 17134.556 上的 Chrome 71.0.3578.98:有问题

Windows 10 Pro 17134.523 上的 Firefox 64.0.2:有问题

Windows 10 Enterprise 17134.556 上的 Internet Explorer 11.523.17134.0:没有问题

Windows 10 Enterprise 17134.556 上的 Edge 42.17134.1.0:没有问题

MacOS 10.13.6 上的 Chrome 71.0.3578.98:没有问题

您可以在下面找到一个快速示例来重现该问题。

<!doctype html>
<html id='html' lang='bg'>
  <head>
    <meta charset='utf-8' />
    <meta name='viewport' content='width=device-width, initial-scale=1, shrink-to-fit=no' />
    <link href="https://fonts.googleapis.com/css?family=Montserrat&amp;subset=cyrillic,cyrillic-ext,latin-ext,vietnamese" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Roboto&amp;subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese" rel="stylesheet">
    <style>
      h1 { font-size: 2em; }
      p { font-size: 1.5em; }
      .native { font-family: sans-serif; }
      .montserrat { font-family: Montserrat, sans-serif; }
      .roboto { font-family: Roboto, sans-serif; }
    </style>
    <title>Sandbox</title>
  </head>
  <body>
    <p>
      <button id='set-bg' type='button'>Set BG</button>
      <button id='set-ru' type='button'>Set RU</button>
    </p>
    <p>User agent: <code id='user-agent'></code></p>
    <p>Language: <code id='lang'></code></p>
    <h1 class='native'>Native</h1>
    <p class='native'>Научете повече за всички наши продукти</p>
    <p class='native'>Допълващи продукти</p>
    <h1 class='montserrat'>Montserrat</h1>
    <p class='montserrat'>Научете повече за всички наши продукти</p>
    <p class='montserrat'>Допълващи продукти</p>
    <h1 class='roboto'>Roboto</h1>
    <p class='roboto'>Научете повече за всички наши продукти</p>
    <p class='roboto'>Допълващи продукти</p>
    <script>
      (function () {
        'use strict';
        function refreshCurrentLang() {
          document.getElementById('lang').innerText = document.getElementById('html').getAttribute('lang');
        };
        function setTogglerHandler(togglerSelector, langValue) {
          document.getElementById(togglerSelector).addEventListener('click', function () {
            document.getElementById('html').setAttribute('lang', langValue);
            refreshCurrentLang();
          });
        };
        document.getElementById('user-agent').innerText = navigator.userAgent;
        setTogglerHandler('set-bg', 'bg');
        setTogglerHandler('set-ru', 'ru');
        refreshCurrentLang();
      })();
    </script>
  </body>
</html>

最佳答案

这并没有错。保加利亚最近(20 世纪后期)开发了自己的西里尔字母版本，并且慢慢开始成为标准，首先是谷歌字体，现在也有苹果字体(保加利亚文本在 iOS 13 系统字体中看起来像这样)。它看起来不寻常，对于其他西里尔字母用户来说颇有争议，但保加利亚人已经非常熟悉这些字母了。
https://bg.m.wikipedia.org/wiki/Българска_кирилица

关于html - 在保加利亚语中使用蒙特塞拉特时西里尔字符显示错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54556466/