Вы здесь

CSS -файлы

В рассматриваемой технологии собственно описание стилей хранится в отдельном фай­ле, который имеет расширение .с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.

Предмет: 

Тест тест