НаследованиеПравила, заданные с помощью таблиц стилей, наследуются дочерними элементами от родительских.
Пример. < p> Белеет парус < em> одинокий < /em> < /p> Автор < em> М.Ю. Лермонтов < /em> В данном примере содержимое тега < em> внутри параграфа унаследует стиль тега < p>, если для тега < em> не указан собственный стиль. Стили, применяемые к конкретным элементам, подменяют собой свойства, заданные выше в иерархии. 3.3. Конфликтующие правила стилей: каскад Возможной (и даже типичной) является ситуация, когда элементы документа получают инструкции по представлению из нескольких источников. При этом обязательно возникают конфликты. Рабочая группа, создававшая CSS, предвидела эту ситуацию и разработала иерархическую систему, в которой различным источниками информации о стилях присваиваются разные веса. Каскадом в таблице стилей называется то, что происходит, когда несколько источников информации о стилях соперничают за контроль над элементами страницы. Информация о стилях передается ниже по иерархии, пока не будет перезаписана информацией, имеющей больший вес. В каскадном порядке существует ряд правил для разрешения конфликтов между конкурирующими таблицами стилей. Когда пользовательский агент (например, браузер) встречает элемент в коде документа, он просматривает все объявления стилей, которые могут к нему применяться, а затем сортирует их по их происхождению таблицы стилей, специфичности селектора и порядку правил и на этом основании определяет, какая таблица применяется. Ниже приводятся веса различных способов объявления стилей в порядке от наименьшего веса к наибольшему. Связанные (при помощи элемента link) внешние таблицы стилей Если существует несколько связанных с документом таблиц стилей, то правила, встречающиеся ниже в документе, имеют приоритет перед правилами, встречающимися выше. Например, если HTML-документ ссылается на две таблицы стилей, как показано ниже: < head> < link rel=" stylesheet" href=" stylel.ess" type=" text/css" /> < link rel=" stylesheet" href=" style2.ess" type=" text/css" /> < /head> Если стилевое правило, указанное в файле style2.css, конфликтует со стилевым правилом, указанным в файле stylel.css, то правило из style2.css будет иметь более высокий приоритет, поскольку данная таблица стилей находится ниже в исходном документе. Импортированные внешние таблицы стилей (с помощью @import) Импортированная информация о стилях подменяет связанные элементом link стили. Если в документе есть несколько директив @import, то правила таблицы, расположенной ниже в документе, имеют приоритет перед правилами таблицы, расположенной выше. Встроенные таблицы стилей (при помощи элемента style) Стили, применяемые в конкретном документе, подменяют те, которые берутся извне. Внутристрочные стили (использующие атрибут style в теге элемента) Внутристрочные стили подменяют собой все прочие объявления стилей, относящиеся к данному элементу, за одним исключением. Объявления стилей, помеченные индикатором! important Любой стиль, помеченный индикатором! important, подменяет собой все прочие конфликтующие с ним правила стилей. Например, чтобы текст абзацев всегда отображался синим цветом, используйте в таблице стилей следующее правило: р {color: blue! important; } Единственное, что может подменить правило с таким индикатором в таблице стилей автора документа, – это правило с таким индикатором, созданное пользователем. Это позволяет гарантировать, что специальные требования читателя, такие как крупный шрифт для людей с нарушениями зрения, никогда не будут подменяться.
|
