Оглавление

Внешние таблицы стилей

Внешняя таблица стилей – это отдельный файл (как правило, с расширением .css), содержащий все описания CSS-стилей для данного сайта. На один и тот же файл могут ссылаться множество страниц, и любые изменения описаний стиля будут распространяться на каждую из них. Такой метод позволяет создавать набор деклараций для целого сайта, о чем уже говорилось выше.

 

Для создания в документе ссылки на внешнюю таблицу стилей (к примеру, styles.css) достаточно разместить в его заголовке элемент link:

<link rel="stylesheet" type="text/css" href="styles.css" />


Помните наш первый пример, в котором для трех заголовков был определен одинаковый стиль? Реализуем то же самое с помощью ссылки на внешнюю таблицу стилей с именем styles.css:

 
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN"
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US">
<head>
<title>Пример страницы</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<h1>Первый заголовок</h1>
<p>…</p>
<h2>Второй заголовок</h2>
<p>…</p>
<h2>Третий заголовок</h2>
<p>…</p>
</body>
</html>

 

Атрибуту rel необходимо присвоить значение stylesheet, а type – text/css. Атрибут href указывает на размещение и имя файла с таблицами стилей.

 

Файл styles.css содержит следующие описания стилей:

h1, h2 {
font-family: sans-serif;
color: #3366CC;
}

 

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

<< Меню >>  
Комментарии принадлежат их авторам. Мы не несем ответственности за их содержание.
Отправитель Нити