CSS свойство all

Свойство all сбрасывает все свойства в их исходные или наследуемые значения, кроме свойств unicode-bidi и direction.

Значение по умолчанию none
Применяется Ко всем элементам.
Наследуется Нет
Анимируемое Нет
Версия CSS3
DOM синтаксис object.style.all = "inherit";

Синтаксис

all: initial | inherit | unset | revert;

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
    <style> 
      .example {
      background-color: #8ebf42;
      color: #666;
      all: revert;
      }
    </style>
  </head>
  <body>
    <h2>Пример свойства all</h2>
    <p>Установлено свойство all: revert;</p>
    <div class="example">
      Экстраверт - дружелюбный человек, который любит быть в окружении других людей. Экстраверты любят вечеринки, разговоры по телефону и новые знакомства.
    </div>
  </body>
</html>

Пример, где применены все четыре значения свойства all:

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок документа</title>
    <style> 
      body {
      font-size: 15px;
      color: #1c87c9;
      }
      .example1 {
      background-color: #8ebf42;
      color: #666;
      }
      .example2 {
      background-color: #8ebf42;
      color: #666;
      all: inherit;
      }
      .example3 {
      background-color: #8ebf42;
      color: #666;
      all: initial;
      }
      .example4 {
      background-color: #8ebf42;
      color: #666;
      all: unset;
      }
    </style>
  </head>
  <body>
    <h2>Пример свойства all</h2>
    <hr>
    <p>Без применения свойства all:</p>
    <div class="example1">
      Экстраверт - дружелюбный человек, который любит быть в окружении других людей. Экстраверты любят вечеринки, разговоры по телефону и новые знакомства.
    </div>
    <hr>
    <p>all: inherit:</p>
    <div class="example2">
      Экстраверт - дружелюбный человек, который любит быть в окружении других людей. Экстраверты любят вечеринки, разговоры по телефону и новые знакомства.
    </div>
    <hr>
    <p>all: initial:</p>
    <div class="example3">
      Экстраверт - дружелюбный человек, который любит быть в окружении других людей. Экстраверты любят вечеринки, разговоры по телефону и новые знакомства.
    </div>
    <hr>
    <p>all: unset:</p>
    <div class="example4">
      Экстраверт - дружелюбный человек, который любит быть в окружении других людей. Экстраверты любят вечеринки, разговоры по телефону и новые знакомства.
    </div>
    <hr>
  </body>
</html>

Значения

Значение Описание
initial Устанавливает свойство в значение по умолчанию.
inherit Значение элемента наследуется от родительского элемента.
unset Указывает на изменение всех свойств, примененных к элементу или родительскому элементу, на значение их родителя, если они наследуемые, или на их начальное значение, если нет.
revert Указывает на поведение, которое зависит от источника таблицы стилей, которому принадлежит объявление.

Поддержка браузера

37.0+ x 27.0+ 9.1+ 24.0+


Считаете ли это полезным?

Похожие статьи