Alla - CSS-tricks

Anonim

Den allegendom i CSS återställer alla det valda elementet egenskaper, utom directionoch unicode-bidiegenskaper som styr textriktningen.

.module ( all: unset; )

Poängen med det är att möjliggöra återställning av stilar på komponentnivå. Ibland är det mycket lättare att börja från grunden med styling snarare än att slåss mot allt som redan finns.

Värden

  • initial: återställer alla de valda elementets egenskaper till sina ursprungliga värden enligt definitionen i CSS-specifikationen.
  • inherit: det valda elementet ärver alla dess överordnade elements utformning, inklusive stilar som normalt inte ärvs.
  • unset: det valda elementet ärver alla ärftliga värden som överförs från det överordnade elementet. Om inget ärftligt värde är tillgängligt används det ursprungliga värdet från CSS-specifikationen för varje egendom.

Några egenskaper har inte ett initialt värde som uttryckligen definierats i specifikationen och tillåter istället användaragenten att ställa in det initiala värdet - coloroch font-familyär två exempel. Om all: initial;eller all: unset;tillämpas används standardvärdet för användaragenten som initialvärdet för dessa egenskaper.

allbetraktas som en ”stenografisk” egenskap eftersom den låter oss styra värdena för varje CSS-egendom samtidigt med en enda deklaration. Till skillnad från de flesta stenografiska egenskaper finns det dock ingen praktisk ”långhandig” version och den har inga underegenskaper.

Demo

Se fliken CSS för kommentarer som anger vilka egenskaper som är ärvbara. Observera att när inheritvärdet används, divärver varje egendom från dess överordnade, inklusive dess width, paddingoch border, och som normalt inte ärvs.

Se Penna alla egendemo från CSS-Tricks (@ css-tricks) på CodePen.

Mer information

  • all i W3C CSS Cascading and Inheritance Level 4 Editor's Draft
  • CSS2 Full Property Table: visar ärvbarhet för alla CSS2-egenskaper. CSS3-specifikationen är uppdelad i flera delar och indexeras i specifikationstabellen.
  • Lär känna Initial: mer information om initialvärdet.
  • Återställ stil med 'all: unset' i Firefox 27 (2013) av Cameron McCormack

Webbläsarstöd

Denna webbläsares supportdata kommer från Caniuse, som har mer detaljer. Ett nummer indikerar att webbläsaren stöder funktionen i den versionen och uppåt.

Skrivbord

Krom Firefox IE Kant Safari
37 27 Nej 79 9.1

Mobil / surfplatta

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