Почему мои шрифты / макет изменяются в процессе производства? Пробные страницы Netlify и Github - PullRequest
1 голос
/ 02 мая 2020

Я пытаюсь разместить сайт на Netlify (или на страницах github), но по какой-то причине при входе в производство меняются шрифты, а также возникают некоторые проблемы с макетом (см. Фотографии)

netlify

[Actual Font[2]

Я не уверен, связана ли эта проблема со спецификой CSS, или мне нужно где-то объявить типы шрифтов; Я уже добавил их в свой тег <head>, и в моем файле css каждый из них импортирован.

Я создал кодовую ручку с кодом: https://codepen.io/aladin94/pen/BaowqgX ( имейте в виду, изображения и макеты будут отличаться). Есть идеи?

Импорт шрифтов:

`<link href="//db.onlinewebfonts.com/c/146c398456e6a22b45102120ae8a7679?family=Narcissus" rel="stylesheet"
type="text/css" />`

<link href="//db.onlinewebfonts.com/c/21400dc679986534519c638136d62dbf?family=Rage+Italic" rel="stylesheet" type="text/css" />

1 Ответ

2 голосов
/ 02 мая 2020

Я предполагаю, что ваш производственный сайт блокирует небезопасный шрифт.

См. Распечатку консоли моего браузера:

Смешанный контент: страница в "..." была загружена по HTTPS, но запросил небезопасный шрифт

http : //db.onlinewebfonts.com/t/146c398456e6a22b45102120ae8a7679.woff

. Этот запрос был заблокирован; контент должен обслуживаться по протоколу HTTPS.

Вы можете изменить поведение для указанного шрифта c или найти безопасный шрифт для своего случая.

Вы пробовали эту ссылку:

<link href="https://db.onlinewebfonts.com/c/146c398456e6a22b45102120ae8a7679?family=Narcissus" rel="stylesheet" type="text/css" />

РЕДАКТИРОВАТЬ : Как уже упоминалось в разделе комментариев, вы можете найти источники в режиме вашего браузера. В моем случае я использую chrome.

Попробуйте загрузить необходимые файлы / источники, и после этого вы можете попытаться загрузить его в свою серверную среду.

Полагаю, это не совсем так. программный вопрос / решение, потому что оно больше связано с обработкой библиотеки или настройкой безопасности.

enter image description here

...