Связанные таблицы стилей используются для придания нескольким документам одного стиля и xранятся в отдельном файле. Это очень привлекательно, когда нужно выдержать сайт в одном стиле, не утруждая себя составлением таблиц для каждого документа.
Пример:
Файл styles.css
<style type="text/css">
body {background:black; font-size:9pt; color:red; font-family:Arial black }
.base {color:blue; font-style:italic }
h1 {color:white}
#bold {font-weight:bold}
</style>
В самих же HTML-документах делается ссылка на этот файл при помощи тега <link> и выглядит это так:
<link rel="stylesheet" type="text/css" href="путь к файлу">
Пример.
<html>
<head>
<title> Просто еще один пример </title>
</head>
<link rel="stylesheet" type="text/css" href="styles.css">
<body>
Содержание документа
</body>
</html>
Например, следующая таблица стилей CSS (хранящаяся в файле "special.css") устанавливает зеленый цвет текста абзаца и окружает его сплошной красной рамкой:
p.special {color : green; border: solid red; }
Авторы могут связывать таблицы стилей с исходным документом HTML с помощью элемента link:
<!DOCTYPE html public "-//w3c//dtd html 4.0//en"
"http://www.w3.org/tr/rec-htm40">
<html>
<head>
<link href="special.css" rel="stylesheet" type="text/css">
</head>
<body>
<p class="special">в этом абзаце текст должен быть зеленым.
</body>
</html>
