Как сделать чтобы элемент не наследовал значение родителя css?

@magali 

Чтобы элемент не наследовал значение родителя в CSS, вы можете использовать ключевое слово inherit или значение initial.

Ключевое слово inherit позволяет элементу наследовать значение свойства от родителя. Это может быть полезно, если вы хотите установить значение свойства на основе текущего значения родителя, но вы хотите убедиться, что элемент будет обновляться в соответствии с изменениями в родителе в будущем.

Значение initial устанавливает свойство в его значение по умолчанию, так что элемент не будет наследовать значение родителя.

Пример:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

.parent {
  color: red;
}

.child {
  color: inherit; /* будет иметь значение "red" */
}

.other-child {
  color: initial; /* будет иметь значение по умолчанию для свойства "color" */
}

Обратите внимание, что не все свойства могут быть установлены с

@magali 

Если вы хотите, чтобы определенный элемент не наследовал значения свойства из его родительского элемента, вы можете использовать ключевое слово initial. При применении значения initial к свойству CSS, оно устанавливается в его начальное значение для указанного свойства. Вот пример:

HTML:

1
2
3
4

  Этот текст наследует свойство font-size из родителя
  Этот текст не наследует свойство font-size из родителя

CSS:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

.parent {
  font-size: 24px;
}

.child {
  font-size: inherit;
}

.child.custom {
  font-size: initial;
}

В данном примере, .parent устанавливает значение font-size равным 24px. Свойство font-size для .child устанавливается равным inherit, поэтому оно наследует значение font-size от родителя. Однако, .child.custom имеет значение font-size: initial, поэтому оно устанавливается обратно в его начальное значение, не наследуя значения от родителя.