* system * ui CSS font-family в Chrome не распознает вес шрифта выше определенного размера шрифта в macOS - PullRequest
2 голосов
/ 16 апреля 2020

Недавно я купил новый 279-дюймовый экран 2019 iMa c с дисплеем Retina 5K. Он должен был заменить мою более старую модель конца 2013 года, которая долгое время была моей рабочей лошадкой.

enter image description here

Вскоре после запуска и запуска с Chrome, я заметил, что некоторые заголовки на веб-сайтах были более смелыми, чем я помнил, и смог выяснить, что это происходит с веб-сайтами, которые используют вариацию стека системных шрифтов. В частности, если font-family было установлено на BlinkMacSystemFont или system-ui, заголовки часто перестали отображаться с правильным весом шрифта. Все выглядит так, как будто вес шрифта был установлен на normal.

Что удивительнее, так это то, что благодаря некоторому возмущению в инструментах разработки ( Ссылка на Codepen ) я понял, что это происходит только с Размер шрифта не должен превышать 20 пикселей, поэтому существует некоторая зависимость от размера, которая влияет на проблему. Похоже, что это как-то связано со сглаживанием шрифтов, так как font-weight начинает работать снова, если я установил -webkit-font-smoothing: none;, но тогда это выглядит совершенно ужасно. Ниже приведен скриншот того, что я имею в виду.

enter image description here

Я полностью сбит с толку этим. Я пытался установить Сан-Франциско из ресурсов Apple Developer . Я пошел в Font Book -> File -> Restore Standard Fonts, который не работал. Я также пробовал установить и снять флажок «Использовать сглаживание шрифтов, когда оно доступно» в «Настройках» -> «Общие».

Если я открою инструменты разработчика Chrome и go для компьютера -> Отображаемые шрифты, он говорит .SF NS, что, как я полагаю, означает, что он находит Сан-Франциско просто отлично, но, по-видимому, перестает работать выше 20px.

Это происходит только на Chrome и только на моем новом iMa c. У моего более старого 27-дюймового iMa c нет этой проблемы с дисплеем, как и у любых других моих устройств Apple с Catalina и Chrome. Так может это как-то связано с 5к дисплеем? Непонятно.

Моя Chrome версия является текущей, на момент написания этой статьи это Версия 81.0.4044.113.

Редактировать:

Некоторые дополнительные копания:

  • Если я вручную укажу «SF Pro Text» или «SF Pro Display» для font-family, он будет правильно отображаться с правильными весами.
  • Эта ошибка Chromium отчет кажется очень актуальным, который ссылается на раздел Руководства Apple для разработчиков , в котором объясняется, почему он меняется ровно на 20 пикселей - потому что именно тогда система пытается использовать SF Pro Display вместо SF Pro Text , Возможно, это указывает на проблему с внутренне установленными версиями этих шрифтов:

Используйте SF Pro Text для текста размером 19 точек или меньше и SF Pro Display для текста размером 20 точек или больше. Когда вы используете Сан-Франциско для текста в стандартных элементах управления, таких как кнопки и метки, macOS автоматически применяет наиболее подходящий вариант на основе размера точки и настроек специальных возможностей пользователя.

  • A related отчет об ошибке хрома , который описывает проблему, связанную с кернингом / отслеживанием. Он закрыт и не упоминает вес шрифта, но кажется, что причина root может быть такой же.

1 Ответ

1 голос
/ 16 апреля 2020

Найдена правильная ошибка хрома. На момент написания статьи все еще открыто, но, надеюсь, будет исправлено в ближайшее время: Выпуск 1057654

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...