5.0 0.5 3 49

Как подключить CSS?

Юлия Агафонова
Юлия Агафонова
1 декабря 2014
60
Оцените:
Как подключить CSS?

Смотрите видео

Как подключить CSS?

Сегодня сложно представить современный сайт без CSS. HTML — это скелет сайта, тогда как каскадные таблицы стилей — его лицо, которое делает сайт привлекательным и отличным от других (читайте статью Что такое CSS). Но как подключить CSS к сайту?

Способы подключения

Есть три способа подключения CSS: первый представляет собой добавление CSS-кода в шапку сайта (глобальные стили), второй — прописывание стилей для каждого элемента (внутренние), а третий — вынесение кода в отдельный файл и отсылка к нему (связанные).

Глобальные стили такого вида: «<style type="text/css">p { line-height: 130%; }</style>», а внутренние такого: «<div style="background: #cccccc; border: 1px #000000 solid;">Блок</div>».

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

Связанные стили

Для того, чтобы подключить файл со связанными стилями к сайту, нужно добавить код «<link rel="stylesheet" type="text/css" href="http://elhowcss.ru/style.css">», где значение параметра href — путь к файлу CSS. Его можно указать как относительным (/css/main.css), так и абсолютным (http://elhowcss.ru/css/main.css).

Код следует размещать в шапке сайта, то есть внутри парного тега <head>. Такой способ является самым универсальным и рациональным, поскольку в HTML только ссылаются на файл с CSS, и два языка находятся порознь.

Импорт стилей

В свою очередь к стилям можно подключить другие стили. В глобальных стилях нужно добавить код: «@import url("/css/fullpage.css");», а в связанных — «@import "/style/fullpage.css" screen;». Здесь так же можно использовать как относительный, так и абсолютный путь.

Подписывайтесь на наши группы в социальных сетях - смешные статьи, картинки и факты!