Чат PHP-разработчиков
Логические задачи
Как подключить таблицу стилей CSS к HTML

Подключение CSS-стилей к HTML

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

Инлайновые стили

Что касается первого варианта, то такие стили называются не подключенными, а встроенными. Еще можно встретить название «инлайновые». Задаются такие стили внутри тега <style> с помощью обычного CSS-кода. А сам этот тег, в свою очередь, находится внутри тега <head>.

Наглядный пример встроенного (инлайнового) стиля:

<head>
  <style>
    CSS-код
  </style>
</head>

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

Подключение внешних стилей

Как правило, стили хранятся в файле с расширением .css. И именно он подключается посредством тега <link>. На примере это выглядит вот так:

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

Ссылка на файл задается с помощью атрибута href. Также обязательным является использование атрибута rel="stylesheet". Он служит своего рода индикатором, благодаря которому браузер определяет, что подключаются именно стили.

Я рекомендую осуществлять подключение стилей внутри тега <head>, но это не принципиально, так как работа тега <link> будет осуществляться в любом месте страницы.

Подробнее стили мы рассмотрим чуть позже. Пока что вам достаточно знать, что такая возможность есть.

Присоединяйтесь к нам в ВКонтакте и в Facebook, чтобы не пропустить новые уроки. А также вступайте в наш чат PHP-разработчиков в Telegram.
Читайте также
Комментарии (0)
Комментирование урока доступно только для патронов проекта. От 1$/месяц.