|
<
Предыдущая Следующая
> Внешнее
объявление
стилей
Внешнее
объявление
стилей
используется
в случаях,
когда
оформление
задается
для группы
связанных HTML документов
(например
для целого
веб-сайта). В этом
случае все
оформление
выносится в
один
внешний
файл, на
который
должны ссылаться
все
документы
веб-сайта. Внешнее
объявление
стилей
очень
удобно так
как
позволяет
редактируя
лишь один
файл
изменять
оформление
целого
веб-сайта. Для того,
чтобы
подключить
внешний
файл стилей
необходимо в
секции head каждой
страницы
веб-сайта
указать
ссылку на
него с
помощью
элемента <link>: Пример: <head> <link rel="stylesheet" type="text/css" href="адрес_внешнего_файла_стилей" /> </head> Обратите
внимание: атрибут type тэга style стал
необязательным
в HTML5. Внешний
файл стилей
является
обычным текстовым
файлом с
расширением .css. Пример
содержимого
внешнего
файла стилей: h1 {color:red;} p {margin-right:38px;} div {float:left;} Внутреннее
объявление
стилей
Внутреннее
объявление
стилей
используются
в случаях,
когда стиль
нужно
задать
только для одного
отдельного HTML документа. В
этом случае
оформление
определяется
в секции head с
помощью
тэга style: Пример: <head> <style type='text/css'> h1 {color:red;} p {margin-right:38px;} div {float:left;} </style> </head> Строковое
объявление
стилей
Строковое
объявление
стилей
используется
в случаях,
когда
необходимо
оформить только
один
определенный
элемент в HTML документе. Для
того, чтобы
оформить
элементы
этим способом
Вы должны
воспользоваться
атрибутом style соответствующего
элемента. Атрибут style может
содержать
любые CSS свойства. Пример: <p style="font-size:1.3em"> Абзац оформленный с помощью CSS.</p> Приоритет
стилей
Стили
подключенные
разным
способом
имеют
разный
приоритет:
Если
один HTML документ
имеет
несколько
стилей
подлюченных
разным
способом и в
них заданы
разные
свойства
оформления
для одного и
того же элемента,
то в итоге
элемент
будет
оформлен
согласно
содержимому
стиля с
более высоким
приоритетом. Пример: Пример /* Внутренние стили: */ h1 {color:red} /* Строковые стили: */ h1 {color:green} /* В результате заголовок будет зеленого цвета так как строковые стили имеют более высокий приоритет */ |
Последние добавления |