26.02.2017   2791
Как подключить таблицу стилей 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> будет осуществляться в любом месте страницы.

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

КОММЕНТАРИИ

Чтобы написать комментарий нужно войти на сайт.
Или получить доступ прямо сейчас:


Нажимая эту кнопку
Вы принимаете политику конфиденциальности