#12 - Подключение файлов

#12 - Подключение файлов

К каждому HTML файлу дополнительно подключаются другие файлы со стилями, скриптами или же картинками. Мы узнаем как можно делать такое, а также разберемся с тегом head и узнаем для чего он нужен.

Видеоурок

HTML тег head существует для создания описания страницы, а также для подключения различных стилей и скриптов. Чтобы к странице подключить CSS стили требуется использовать специальный тег link, который дополнительно не требует закрывающего тега и выглядит следующим образом:

<link href="style.css" rel=stylesheet type="text/css">

В атрибуте href необходимо указывать полный путь к CSS файлу. Также необходимо добавлять атрибуты rel и type для указания информации о том, что конкретно находится в подключаемом файле.


Добавление скриптов на сайт

Помимо стилей мы также можем подключать различные скрипты, которые помещаются в теге <script>. В атрибуте src можно указать полный путь к файлу со скриптами или же можно прописать JavaScript код внутри тега «script». 


Важно также понимать, что некоторые скрипты не всегда нужны при загрузке страницы, поэтому их загрузку можно отложить на самый конец. Чтобы это сделать необходимо добавить скрипты не в начале кода страницы (не в теге head), а в конце страницы перед закрывающим тегом body. Кстати, такая же схема не подходит для подключения стилей, они всегда должны находиться в теге head.


Описание сайта в meta-тегах

Чтобы браузеру было проще понять что находиться на сайте, вы можете добавить специальные мета теги. Значений для этих тегов существует очень много, но лишь некоторые значения стоит знать. Каждый мета-тег не нуждается в закрывающем теге.


К некоторым основным мета-тегам можно отнести такие: тег с описанием страницы, тег с ключевыми словами, тег с указанием кодировки сайта. 


Также существуют и другие мета-теги, которые можно использовать для описания сайта, но на ранних этапах вам вполне хватит тегов из урока, чтобы браузер лишь понимал о чём идет речь на сайте.

Онлайн редактор кода

Загрузка...

Задание к уроку

Необходимо оформить подписку на проект, чтобы получить доступ ко всем домашним заданиям

Большое задание по курсу

Вам необходимо оформить подписку на сайте, чтобы иметь доступ ко всем большим заданиям. В задание входит методика решения, а также готовый проект с ответом к заданию.
PS: подобные задания доступны при подписке от 1 месяца

Также стоит посмотреть

Изучение CSS/CSS3 от нуля до гуру!
15 уроков
Видеокурс по PHP, MySQL / Создание динамического сайта
Верстка сайта на HTML5 и CSS3
13 уроков
Создание сайта с нуля | Полноценная верстка сайта
11 уроков
Создание адаптивного сайта
4 урока
Вёрстка адаптивного сайта на Bootstrap 4
6 уроков
Комментарии для сайта Cackle