Подключение CSS-стилей на странице сайта

Подробности

Опубликовано 26.10.2012 14:22

Есть несколько вариантов задания стилей на странице сайта или документа (как удобней). Стили применяются как HTML так и XML документам. Рассмотрим основные варианты.

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

<link type="text/css" rel="stylesheet" href="/templates/it-articl_v1.0/css/main.css" />

Задание стилей в теле документа в отдельном теге. Удобно применять частные стили применительно для одной страницы.

<style type="text/css">
код стиля
</style>

Подключение файла стилей в теге стилей возможно через @import. Применять этот вариант подключения можно тогда, кода у вас нет возможности подключить файл в шапку документа, а разбить на разные файлы стилей необходимо.

<style type="text/css" media="all">
@import url(/templates/it-articl_v1.0/css/main.css);
</style>

Задача стилей внутри тега. Очень частный вариант, применительно к тем случаям где вы хотите применить стиль только для текущего элемента и едино разово.

<p style="код стиля"></p>

Задание стилей для XML документам.

<?xml-stylesheet type="text/css" href="/templates/it-articl_v1.0/css/main.css"?>

На этом можно закончить, стили к документу задать можем, пойдем дальше.