Encodera

Спасибо, что читаете!

Пожертвуйте сайту, мы стараемся ради вас.

Справочник HTML & CSS

inherit, initial, unset, revert

Ключевые слова, которые работают в любом свойстве и по-разному его сбрасывают.

Синтаксис

property: inherit | initial | unset | revert;

Параметры

ПараметрТипОписание
inheritkeywordВзять значение у родителя.
initialkeywordНачальное значение из спецификации CSS (для `color` — чёрный).
unsetkeyword`inherit` для наследуемых свойств, `initial` для остальных.
revertkeywordВернуться к стилю браузера по умолчанию для этого элемента.

Примеры

Ссылка с цветом родителя:

<style>
  .card { color: darkgreen; border: 2px solid currentColor; padding: 8px; }
  .card a { color: inherit; }
</style>
 
<div class="card">The link takes the card color: <a href="#">Read more</a></div>

initial и revert отличаются:

<style>
  li { list-style: square; color: crimson; }
  .a { color: initial; }
  .b { list-style: revert; }
</style>
 
<ul>
  <li class="a">initial: black, the CSS default</li>
  <li class="b">revert: the browser's own bullet style</li>
</ul>

Примечания

initial часто удивляет: для display это inline, даже у div. Чтобы вернуть «как показывает браузер», берите revert. Есть ещё revert-layer — он отменяет стили текущего каскадного слоя.

См. также

  • !important — Заставляет объявление побеждать все обычные объявления независимо от специфичности.
  • @layer — Группирует стили в каскадные слои: более поздний слой побеждает независимо от специфичности.
  • font — Сокращённая запись, которая задаёт начертание, жирность, размер, высоту строки и семейство шрифта в одну строку.

В учебнике

  • Общие значения — Ключевые слова inherit, initial, unset и revert, которые принимает любое CSS-свойство, и свойство all для сброса всех стилей сразу.

Спасибо, что читаете!

Пожертвуйте сайту, мы стараемся ради вас.