Свойства в css, наследуемые по умолчанию

Некоторые свойства в css, заданные родительскому элементу, наследуются его потомками, это работает так :

Пример 1
div {
    color: green;
    font-size: 16px;
}
				
<div>
<span>Подопытный текст</span>
</div>
Результат
Подопытный текст

span унаследовал от своего родителя div цвет текста и размер шрифта, все потомки этого span’a также унаследуют их по умолчанию, если их не переопределить.

Также элемент можно принудительно заставить наследовать какое-то свойство родителя с помощью значения inherit, значение inherit имеют большинство свойств в css.

Пример 2
.box {
    padding: inherit;
}
				

Потомки наследуют по умолчанию не все свойства родителя, наследуется определенный набор css-свойств, который в большинстве ситуаций и так пришлось бы дублировать для потомков элемента, этот механизм призван упростить верстальщикам жизнь.

Список всех наследуемых по умолчанию свойств

Ниже приведена таблица всех наследуемых по умолчанию потомками от родителей свойств с небольшими пояснениями.

color Задает цвет текста.
cursor Задает тип курсора.
direction Задает направление текста.
font Сокращенная запись сразу для всех свойств текста, в них входят: font-family, font-size, font-style, font-variant, font-weight, line-height. Все эти свойства наследуются дочерними элементами от родителей по умолчанию с одним исключением: теги <input>, <textarea>, <button>, <select>, <keygen> не наследуют от родителей свойства font-family и font-size, браузеры назначают им собственные значения этих свойств в user agent stylesheets.
letter-spacing Задает расстояние между отдельными буквами.
list-style Сокращенное универсальное свойство для описания всех свойств маркеров списка, в них входят: list-style-type, list-style-position, list-style-image. Они применяются и наследуются только следующими элементами: <ul>, <ol>, <li>, <dt> и <dd>, а также всеми элементами со значением display: list-item.
orphans Работает при печати страницы на бумагу. Указывает минимальное количество строк, которое остается на предыдущей странице, если весь текст размещается на двух или более страницах.
quotes Определяет вид кавычек в тексте.
text-decoration Задает декорирование текста. Обычно передается потомкам элемента, забирая для декорирования(подчеркивание, перечеркивание, линия сверху) цвет родительского элемента(а не применяя цвет каждого дочернего элемента для его декорирования, даже, если color задан дочернему элементу конкретно). Но не передается, если свойство display дочернего элемента равно inline-block или inline-table ( в Firefox еще и inline-flex) и при любом display, если элементу задан position:absolute или position:fixed.
text-align Задает выравнивание текста по горизонтали. Теги <input>, <textarea>, <button>, <select>, <keygen> не наследуют от родителей свойство text-align, браузеры назначают им собственные значения этого свойства в user agent stylesheets.
text-indent Задает отступ первой строки блока текста. Строковые элементы не наследуют text-indent, к ним он не применяется. В Firefox таблицы также не наследуют text-indent от своих родителей, чтобы правило сработало, его нужно применить к самому тегу <table> или к тегам внутри него - <th>, <tr>, <td>, <tbody>, <tfoot>, <caption>. Теги <input>, <textarea>, <button>, <select>, <keygen> не наследуют от родителей свойство text-indent, браузеры назначают им собственные значения этого свойства в user agent stylesheets.
text-transform Задает способ трансформации текста. Теги <input>, <textarea>, <button>, <select>, <keygen> не наследуют от родителей свойство text-transform, браузеры назначают им собственные значения этого свойства в user agent stylesheets.
visibility Управляет видимостью элемента на странице.
white-space Задает модель отображения пробелов между словами и переносов строк.
widows Работает при печати страницы на бумагу. Указывает минимальное количество строк, которое остается на второй странице, если весь текст размещается на двух или более страницах.
word-spacing Задает расстояние между словами.
border-collapse Наследуется только в IE. Управляет отображением границ для соседних ячеек таблицы (вложенные таблицы наследуют от таблицы-родителя).
Добавить комментарий
Ваше имя (Обязательно)
Ваш e-mail (Обязательно)
Ваш комментарий
Что это? Всатвить код: Link CSS HTML Javascript PHP SQL
Чтобы добавить в комментарий ссылку, стили, разметку или скрипт, оберните его в соответствующий тег с помощью этих кнопок, например [CSS].my-class{margin:0}[/CSS]. Вы можете создать теги обертки с помощью кнопок и вписать туда свой код, или же написав код, выделить его и нажать на кнопку тега, это обернет ваш код в желаемый тег.