Как избежать предупреждения CSS «Переопределение« font-family »» в W3C CSS? - PullRequest
0 голосов
/ 11 марта 2019

В объявлении @font-face шрифтов многие веб-дизайнеры используют разные сегменты unicode-range для одного и того же семейства шрифтов.

Назначение этого дескриптора [unicode-range] позволяет сегментировать ресурсы шрифта так, чтобы браузеру нужно было загружать только ресурсы шрифта, необходимые для текстового содержимого конкретной страницы.

Они делают что-то подобное

/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  src: local('Nunito Regular'), local('Nunito-Regular'), url("fonts/XRXV3I6Li01BKofIOuaBXso.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
  font-display: fallback;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  src: local('Nunito Regular'), local('Nunito-Regular'), url("fonts/XRXV3I6Li01BKofINeaB.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  font-display: fallback;
}

И действительно, это работает, поскольку браузер загружает только то, что нужно (я тестировал с консолью Google Dev на вкладке network).

Хотя валидатор CSS W3C выдает это предупреждение:

Redefinition of “font-family”

Есть ли способ избежать предупреждения?

...