Css inherit, initital, unset, all, alexdev

Сьогодні я розповім про чотири цікавих ключових словах CSS. Почнемо!

Ключове слово: inherit

Відразу розглянемо приклад:

В результаті елемент span буде успадковувати властивість font-size від батьківського елемента. Якщо у батьківського елемента не визначено властивість font-size. тоді елемент span буде використовувати обчислене у батька властивість font-size (яке може бути успадковано від другого з батьків).

Слово inherit може стати в нагоді, коли ви хочете привласнити одне і теж значення на купу дочірніх елементів. наприклад:

Тепер всі елементи div всередині module наслідуватимуть значення властивості box-shadow.

Ключове слово: initial

Ключове слово initial вперше з'явилося в CSS3. Кожне CSS властивість має початкове значення або значення за замовчуванням.

Визначаючи значення властивість використовуючи ключове слово initial. ви говорите браузеру: «використовуй значення властивості за замовчуванням».

Наприклад, ви можете захотіти використовувати значення кольору за замовчуванням:

Елемент example матиме колір такий же, як встановлено в body. Таким чином ми скинули інший колір цього елемента, наприклад, який дістався у спадок від батьківського елемента і був червоним.

Що стосується підтримки браузерами: initial працює в останніх версіях Chrome і Firefox. Щодо інших браузерів я не впевнений.

Ключове слово: unset

Різниця між unset і initial в тому, що значення, які могли бути успадковані елементом, скидаються.

Властивість: all

Властивість all скидає все властивості елемента.

У специфікації сказано:

«Дана властивість може використовуватися для елементів віджетів на сторінці, де небажано успадковувати стилі сторінки».

Дякую за увагу!

Підписуйтесь на розсилку! 😉