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

Question

Cosmonaut . @Alizoda

WEB DESIGNER

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

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

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

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

Вопрос задан более трёх лет назад
3736 просмотров

2 комментария

Подписаться 2 Средний 2 комментария

yarnstart @yarnstart

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

Написано более трёх лет назад

Cosmonaut . @Alizoda Автор вопроса

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;
}

Написано более трёх лет назад

Решения вопроса 1

1 комментарий

Пригласить эксперта

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации

Похожие вопросы

JavaScript

+2 ещё

Средний
Как отсортировать в ХТМЛ по дате рождения от младшего к старшему, а так же, нумерацию их 1,2,3,4. Чтобы можно было потом добавить еще людей?
- 1 подписчик
- 4 часа назад
- 28 просмотров
1

ответ
HTML

+1 ещё

Простой
При загрузке картинки этот блок не имеет размера, как исправить?
- 1 подписчик
- 7 часов назад
- 42 просмотра
0

ответов
JavaScript

+2 ещё

Простой
Пустая страница, ошибок нет. JS. В чем проблема?
- 1 подписчик
- 8 часов назад
- 152 просмотра
1

ответ
CSS

Простой
Как убрать отступ?
- 1 подписчик
- 11 часов назад
- 90 просмотров
2

ответа
HTML

+1 ещё

Простой
Как кодировать кириллицу в поле data?
- 1 подписчик
- 13 часов назад
- 39 просмотров
1

ответ
Вёрстка

Средний
Как правильно вставлять изображения при наличии двух тем оформления сайта?
- 1 подписчик
- 18 часов назад
- 95 просмотров
1

ответ
HTML

+1 ещё

Простой
Как в теге select один символ сделать другого цвета?
- 1 подписчик
- 20 часов назад
- 85 просмотров
1

ответ
CSS

Простой
Как уместить кроссбраузерную поддержку в одну строку?
- 1 подписчик
- 20 часов назад
- 102 просмотра
1

ответ
HTML

+1 ещё

Простой
Как поставить элементы в одну строку и выровнять их?
- 1 подписчик
- вчера
- 79 просмотров
1

ответ
CSS

+1 ещё

Простой
Как стилизовать пагинацию постов по определённому признаку?
- 1 подписчик
- вчера
- 74 просмотра
1

ответ
Показать ещё Загружается…

Frontend-разработчик (React)

ДАЛЕЕ

от 130 000 ₽

JavaScript разработчик

вАйТи

от 5 000 до 25 000 ₽

Frontend React

Glob-com

от 100 000 ₽

Дописать функцию на Flutter, работа с yandex map kit

20 апр. 2024, в 04:18

3000 руб./за проект

Английская версия для сайта на WordPress

20 апр. 2024, в 03:34

8000 руб./за проект

Доработать клиентское приложение для GTA 5 на C#

20 апр. 2024, в 00:51

1000 руб./за проект

Покажите как вы их подключали, посоветую вот такой генератор для шрифтов https://www.fontsquirrel.com/ , возможно дело именно в этом
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 · 2019-02-18 14:31:21

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;
}

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

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт