Описание
Описание каждого CSS свойства говорит наследуется ли оно по-умолчанию ("Наследуется: да/нет"). Наследование контролирует, что происходит, если значение свойства элемента не определено.
Наследуемые свойства
Когда нет значения для наследуемого свойства, элемент получает вычисленное значение этого свойства от родителя. Только корневой элемент документа получает начальное значение из описания свойства.
Типичный пример наследуемого свойства color. Стили:
p { color: green }
и разметка:
<p>В этом параграфе <em>подчёркнутый текст</em>.</p>
слова "подчёркнутый текст" станут зелёными, т.к. тег em унаследовал значение свойства color от элемента p, а не получают начальное значение свойства (цвет, который используется для корневого элемента, когда страница не определяет цвет).
Ненаследуемые свойства
Когда не задано значение ненаследуемого свойства (иногда называемое Mozilla - сброшенное свойство), элемент получает начальное значение этого свойства (как указано в описании свойства).
Пример ненаследуемого свойства border. Стили:
p { border: medium solid }
и разметка:
<p>В этом параграфе <em>подчёркнутый текст</em>.</p>
у слов "подчёркнутый текст" не будет рамки (т.к. начальное значение border-style:none).
Замечание
Ключевое слово inherit позволяет нам явно задать наследование. Это работает и на наследуемых, и на ненаследуемых свойствах.
Смотрите также
- CSS документация
- Ключевые концепции CSS: Синтаксис CSS, @-правила, комментарии, специфичность и наследование, блочная модель, режимы компоновки и модели визуального форматирования, схлопывание отступов, начальные, вычисленные, решённые, указанные, используемые и действительные значения. Синтаксис определения значений, сокращённые свойства и замещаемые элементы.
inherit