С HTML 4.0 все форматирование может быть перемещенно из документов HTML и в отдельную таблицу стилей.
Примеры
Этот пример демонстрирует, как отформатировать HTML документ с добавлением стиля в раздел 'head'
Этот пример демонстрирует, как использовать тег 'link' для ссылки на внешнюю таблицу стилей.
Как использовать стили
Когда браузер читает таблицу стилей, он форматирует документ в соответствии с ней. Есть три способа добавления стилей:
Внешние стили
Внешняя таблица стилей является идеальной, когда стиль применяется на многих страницах.
С внешней таблицей стилей, вы можете изменить внешний вид всего веб-сайта путем изменения одного файла. Каждая страница должна иметь ссылку на таблицу стилей помощью тега <link>. Тег <link> должен находиться в головной части документа, между тегами <head> </head>.
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
Внутренние стили
Внутренние стили следует использовать, когда один документ имеет свой уникальный стиль. Для определения внутренних стилей в головную часть документа нужно поместить тег <style>.
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>
Встроенные стили
Встроенные стили следует использовать, когда уникальный стиль будет применяться только к одному элементу.
Чтобы использовать встроенные стили вы должны использовать атрибуты стиля в соответствующих тегах. Стиль атрибута может содержать любые параметры CSS. Приведенный пример показывает, как изменить цвет и отступ от левого края абзаца:
This is a paragraph
</p>
Теги стилей
| Тег | Описание |
|---|---|
| <style> | Определяет параметры стиля |
| <link> | Определяет ссылку на ресурс |
| <div> | Определяет часть документа |
| <span> | Определяет часть документа |
| <font> | Не рекомендуется. Используйте стили вместо этого |
| <basefont> | Не рекомендуется. Используйте стили вместо этого |
| <center> | Не рекомендуется. Используйте стили вместо этого |

