Всички - CSS-трикове

Anonim

В allимота в CSS нулира всички свойства на избрания елемент, освен тези с directionи unicode-bidiсвойства, че контролът текст посока.

.module ( all: unset; )

Смисълът е да се даде възможност за нулиране на стилове на ниво компонент. Понякога е много по-лесно да започнете от нулата със стила, вместо да се биете срещу всичко, което вече е там.

Стойности

  • initial: нулира всички свойства на избрания елемент до първоначалните им стойности, както е дефинирано в спецификацията на CSS.
  • inherit: избраният елемент наследява целия стил на своя родителски елемент, включително стилове, които обикновено не са наследствени.
  • unset: избраният елемент наследява всички наследствени стойности, предадени от родителския елемент. Ако няма налична наследствена стойност, първоначалната стойност от спецификацията на CSS се използва за всяко свойство.

Няколко свойства нямат първоначална стойност, изрично дефинирана в спецификацията и вместо това позволяват на потребителския агент да зададе началната стойност - colorи font-familyса два примера. Ако all: initial;или all: unset;е приложено, стойността по подразбиране на потребителския агент се използва като initialстойност за тези свойства.

allсе счита за „стенографско“ свойство, защото ни позволява да контролираме стойностите на всяко свойство на CSS наведнъж с една декларация. Въпреки това, за разлика от повечето стенографски свойства, няма практическа „дългосрочна“ версия и тя няма под-свойства.

Демонстрация

Вижте раздела CSS за коментари, които показват кои свойства са наследствени. Забележете, че когато inheritсе използва стойността, divнаследява всяко свойство от своя родител, включително widthи padding,, и border, които обикновено не се наследяват.

Вижте демонстрацията на Pen all property от CSS-Tricks (@ css-tricks) на CodePen.

Повече информация

  • all в редакцията на редактор на каскадно и наследяване на ниво 4 на W3C CSS
  • Таблица с пълни свойства на CSS2: показва наследствеността на всички свойства на CSS2. Спецификацията CSS3 е разделена на множество части и е индексирана в таблицата със спецификации.
  • Запознаване с Initial: повече подробности за initialстойността.
  • Нулиране на стила с помощта на „всички: unset“ във Firefox 27 (2013) от Камерън Маккормак

Поддръжка на браузър

Тези данни за поддръжка на браузъра са от Caniuse, който има повече подробности. Число показва, че браузърът поддържа функцията на тази версия и по-нова.

работен плот

Chrome Firefox IE Ръб, край Сафари
37 27 Не 79 9.1

Мобилен / таблет

Android Chrome Android Firefox Android iOS Safari
88 85 4.4.3-4.4.4 9.3