Подключение шрифтов

Люди добрые, помогите, кто как может!
В общем впервые ставлю шрифт и получается не очень.
Пока что я

  1. скачал ttf - file
  2. кинул его в css папку
  3. прописал в файле
@font-face{
	font-family:'Cookie Monster';
	src: url('CookieMonster.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
.........
.header h1 {
	font-family: 'Cookie Monster', 'Times New Roman', arial, verdana, sans-serif;
	font-size: 20px;
}

Но че-то нифига не работает. В чем проблема?

Ты путь неправильно указал.

Оказывается, просто не нужны были скобки. А ещё я файл кинул не в ту папку :) Думаю, что-то из этого блокировало

Вот хороший вариант подключения http://www.paulirish.com/2009/bulletproof-font-face-implementation-syntax/

спасибо. А что вообще можно сделать чтоб работало и под ИЕ если на руках есть только 1 скачанный файл шрифта, к примеру, src: url(StoryBook.otf)format(‘opentype’)?

Для того, что бы шрифты работали нормально, их нужно конвертировать в форматы woff, eot, svg для разных браузеров. Хорошая тулза для этого


правда она работает только с лицензионными шрифтами. Загружаешь свой шрифт и она отдает тебе архив со шрифтами и цсс-файлом (все остальное оттуда можно удалять). В цссе нужно будет поправить пути.
Если не подойдет, можно попробовать один из этих

http://www.font2web.com/
https://www.web-font-generator.com/

1 лайк

шикарная прога с белкой, большое спасибо!

на здоровье)

Минутка рекламы: http://webfont.ru (там уже готовые сконвертированные, но тоже только бесплатные)

Вслед за шрифтами пробую подключить CSS библиотеку, что мы рассматривали на 22 уроке animate CSS, при чем в хеде честно прописал

<link rel="stylesheet" href="animate.css">

Объекту класс динамически задается , а толку нет. С чем это может быть связано, кто может подсказать?

Проверь, что библиотека подключена (Панель Network)
Проверь, что на классы приаттачились стили из нее (Elements - блок CSS)

В панели Network показано что файл перманентно фейлится. Чего он так?

неправильный путь, вероятно

1 лайк

При таком подключении у тебя файл css должен лежать в одной папке с html

Да, туда-сюда файлы тасовал, забыл в цсс отписывать изменения. Там все ок, спасибо.
Вообще хотел спросить чисто юзабильный вопрос - если делать картинку рядом со списком ссылкой и не подписывать что она ссылка - это нормально? Пользователь разберется?

Ну было бы круто изменять картинку по :hover
Тогда бы user точно понял что к чему

Ну или тени прикрутить, как вариант

1 лайк