В рассматриваемой технологии собственно описание стилей хранится в отдельном файле, который имеет расширение .сss (для стилей CSS ) или . jss (для стилей JSSS - JavaScript Style Sheet , разработанных компанией Netscape ). Такой файл является обычным ASCII -файлом (как и HTML -файл). Для обращения к файлу внешних стилей ему присваивается имя, например, firmstyle.сss .
Содержательная часть CSS -файла состоит только из листа стилей. Для пояснений в эти файлы могут включаться комментарии. Количество правил, описываемых в файле стилей, может быть любым.
Приведем пример CSS -файла:
Р.red { font-weight : bold; color : red}
SPAN {font-style:italic; font-size:14pt}
.yellowbg {background-color : yellow; font-family:arial }
Как видим, CSS -файл не содержит каких-либо заголовков или конечных элементов.
Обращение к внешнему листу стилей (элемент LINK )
Основным инструментом подключения к HTML -документу внешних листов стилей является одиночный тег <LINK>. Этот тег располагается в заголовочной части HEAD. В состав тега <LINK> входит ряд атрибутов, из которых три являются обязательными - это:
✓ type= " text / ess " - указывает браузеру, что применяется текст формата CSS .
✓ href - задает URL файла внешнего листа стилей. Если CSS -файл располагается втом же каталоге, что и текущий документ, то указывается только имя файла, например, firmstyle.сss.
✓ rel=" stylesheet " - определяет отношение между текущим документом и объектом ссылки href. Значение stylesheet указывает на то, что элемент LINK устанавливает связь с внешним листом стилей.
Допустим, CSS -файл с именем mainst . css размещен в папке Styles сайта : . Для обращения к внешнему листу стилей достаточно в текст форматируемого документа вставить элемент LINK:
< HTML > < HEAD >
<Т1ТЬЕ>Название страницы</Т1ТЪЕ> < LINK rel =" stylesheet "
"
type= " text/ess ">
</HEAD>
<BODY>
<!--Содержимое документа --> </ BODY > </ HTML >
Один элемент link устанавливает связь только с одним CSS- файлом. Для обращения, например, к трем файлам, содержащим листы стилей, в HTML -документ необходимо ввести три элемента link.