Перейти до вмісту
Пошук в
  • Детальніше...
Шукати результати, які ...
Шукати результати в ...

[РЕШЕНО] Проблемы с @font-face, слетают все настройки стиля


Recommended Posts

:-D Даже интересно, пробовал на своем демо сайте подключить какойнибудь шрифт из не стандартных, вот как делал

Подключил файл стилей шрифта  и закачал в папку шрифт /catalog/view/theme/ВаШ_Шаблон/font/googli.woff2

<link rel="stylesheet" type="text/css" href="catalog/view/theme/ВаШ_Шаблон/font/font.css">

Затем Создал сам font.css? где добавил

/* cyrillic */
@font-face {
  font-family: 'Poiret One';
  font-style: normal;
  font-weight: 400;
  src: local('Poiret One'), local('PoiretOne-Regular'), url(/catalog/view/theme/ВаШ_Шаблон/font/googli.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

Затем в stylesheet.css изменял font-family:

h1,  .welcome #title{
	color: #000;
	  ---> font-family: Arial, Helvetica, sans-serif;
        font-family: 'Poiret One';
	margin-top: 0px;
	margin-bottom: 20px;
	font-size: 30px;
}

Ну вот и все, теперь h1 оттображается нестандартным шрифтом, проверял во всех современных брайзерах на компе - работает, проверял на смартфоне в опере и гугле работает, а вот мозила никак не хочет отображать этот шрифт (вот кстати и сам шрифт http://fonts.gstatic.com/s/poiretone/v4/cKr_e199f0xMkxMkRbEJXyEAvth_LlrfE80CYdSH47w.woff2 только я его в googli переименовал), наверное мозила не понимает эти шрифты и заменяет на Ariel

 

Вот и всё!  :eek:КАРТИНКА ТУТ ===> post-683955-0-58861600-1413497433_thumb.png

Да и это наверное проблема самого шрифта он только кирилический, латиница отображалась Arial

Надіслати
Поділитися на інших сайтах


Супер!теперь у меня появилась надежда :-D

У меня несколько уточнений:

 

<link rel="stylesheet" type="text/css" href="catalog/view/theme/ВаШ_Шаблон/font/font.css">

эту строку помимо хэдера я ведь должна вставить еще куда-то, поскольку в центральной части сайта тоже нестандартные шрифты? 

только я не понимаю куда?

 

и по поводу font.css

если у меня несколько нестандарт. шрифтов, я их все в этот один файл должна прописать, или как?

Надіслати
Поділитися на інших сайтах


Супер!теперь у меня появилась надежда :-D

У меня несколько уточнений:

 

 

<link rel="stylesheet" type="text/css" href="catalog/view/theme/ВаШ_Шаблон/font/font.css">
эту строку помимо хэдера я ведь должна вставить еще куда-то, поскольку в центральной части сайта тоже нестандартные шрифты? 

только я не понимаю куда?

 

Вставляем только в хэдэр, один раз

 

и по поводу font.css

если у меня несколько нестандарт. шрифтов, я их все в этот один файл должна прописать, или как?

 

 

в font.css прописываем

@font-face {
  font-family: "PT Serif";
  src: url("../fonts/ptserif-bolditalic.eot");
  src: local('☺'), 
  url("../fonts/ptserif-bolditalic.eot?#iefix") format("embedded-opentype"), 
  url("../fonts/ptserif-bolditalic.woff") format("woff"), 
  url("../fonts/ptserif-bolditalic.ttf") format("truetype"), 
  url("../fonts/ptserif-bolditalic.svg#PT Serif") format("svg");

  font-weight: bold;
  font-style: italic;
} 

код для каждого шрифта отдельно

 

И еще читал

Internet Explorer поддерживает только формат EOT
Браузеры Mozilla (Firefox, Seamonkey) поддерживает OTF и TTF форматы
Safari и Опера поддерживают OTF, TTF и SVG
Chrome поддерживает TTF и SVG.

 Ну вот както так, я со шрифтами как-то не работал, считаю что на сайте должны быть локальные шрифты без засечек, просто и без всяких проблем.   :-D  :eek: Надеюсь вам помог или хотябы подтолкнул на мысль.... :-)

 

Обращайтесь если что, можете в друзья добавиться )))

Надіслати
Поділитися на інших сайтах


Створіть аккаунт або увійдіть для коментування

Ви повинні бути користувачем, щоб залишити коментар

Створити обліковий запис

Зареєструйтеся для отримання облікового запису. Це просто!

Зареєструвати аккаунт

Вхід

Уже зареєстровані? Увійдіть тут.

Вхід зараз
  • Зараз на сторінці   0 користувачів

    • Ні користувачів, які переглядиють цю сторінку

×
×
  • Створити...

Important Information

На нашому сайті використовуються файли cookie і відбувається обробка деяких персональних даних користувачів, щоб поліпшити користувальницький інтерфейс. Щоб дізнатися для чого і які персональні дані ми обробляємо перейдіть за посиланням . Якщо Ви натиснете «Я даю згоду», це означає, що Ви розумієте і приймаєте всі умови, зазначені в цьому Повідомленні про конфіденційність.