Почему не правильно отображается шрифты на safari?

Question

[Cosmonaut .]

Здравствуйте!

Почему не правильно отображается шрифты на safari?

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

Comments

[yarnstart]

Покажите как вы их подключали, посоветую вот такой генератор для шрифтов https://www.fontsquirrel.com/ , возможно дело именно в этом

[Cosmonaut .]

eugenekazakov,

@font-face {
font-family: 'Circe Bold';
src: url('/f/Circe-Bold.eot');
src: url('/f/Circe-Bold.eot?#iefix') format('embedded-opentype'),
url('/f/Circe-Bold.woff') format('woff'),
url('/f/Circe-Bold.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}


@font-face {
font-family: 'Circe Regular';
src: url('/f/Circe-Regular.eot');
src: url('/f/Circe-Regular.eot?#iefix') format('embedded-opentype'),
url('/f/Circe-Regular.woff') format('woff'),
url('/f/Circe-Regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}

Answer 1

[Ankhena]

Cosmonaut ., одинаковые шрифты подключаются с одним именем, различающуюся жирность и стиль пишут в font-weight и font-style.

Для современных браузеров нужны форматы woff2 и woff.

@font-face {
    font-family: "OpenSans";
    src: url("fonts/opensans.woff2") format("woff2")
            url("fonts/opensans.woff") format("woff") ;
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "OpenSans";
    src: url("fonts/opensansbold.woff2") format("woff2"),
            url("fonts/opensansbold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
}

Comments

[Cosmonaut .]

Спасибо вам огромное!