Het all
pand in CSS herstelt alle eigenschappen van het gekozen element, met uitzondering van de direction
en de unicode-bidi
eigenschappen die de controle richting van de tekst.
.module ( all: unset; )
Het punt hiervan is het opnieuw instellen van stijlen op componentniveau. Soms is het veel gemakkelijker om helemaal opnieuw te beginnen met stylen in plaats van te vechten tegen alles wat er al is.
Waarden
initial
: zet alle eigenschappen van het geselecteerde element terug naar hun oorspronkelijke waarden zoals gedefinieerd in de CSS-specificatie.inherit
: het geselecteerde element neemt de stijl van het bovenliggende element over, inclusief stijlen die normaal niet kunnen worden overgenomen.unset
: het geselecteerde element erft alle overneembare waarden die zijn doorgegeven van het bovenliggende element. Als er geen overneembare waarde beschikbaar is, wordt de initiële waarde uit de CSS-specificatie voor elke eigenschap gebruikt.
Een paar eigenschappen hebben geen initiële waarde die expliciet is gedefinieerd in de specificatie en staan in plaats daarvan de user-agent toe om de initiële waarde in te stellen - color
en dit font-family
zijn twee voorbeelden. Als all: initial;
of all: unset;
wordt toegepast, wordt de standaardwaarde van de user-agent gebruikt als initial
waarde voor deze eigenschappen.
all
wordt beschouwd als een "steno" -eigenschap omdat het ons in staat stelt om de waarden van elke CSS-eigenschap in één keer te beheren met een enkele declaratie. In tegenstelling tot de meeste steno-eigenschappen is er echter geen praktische "handgeschreven" versie en heeft deze geen sub-eigenschappen.
Demo
Zie het CSS-tabblad voor opmerkingen die aangeven welke eigenschappen kunnen worden overgenomen. Merk op dat wanneer de inherit
waarde wordt gebruikt, het div
erft elke eigenschap van zijn ouder, met inbegrip van het is width
, padding
en border
die normaal gesproken niet geërfd.
Bekijk de demo van alle eigenschappen van Pen door CSS-Tricks (@ css-tricks) op CodePen.
Meer informatie
all
in de W3C CSS Cascading and Inheritance Level 4 Editor's Draft- CSS2 Full Property Table: toont de overerfbaarheid van alle CSS2-eigenschappen. De CSS3-specificatie is onderverdeeld in meerdere delen en is geïndexeerd in de tabel met specificaties.
- Kennismaken met Initial: meer informatie over de
initial
waarde. - Stijl opnieuw instellen met 'all: unset' in Firefox 27 (2013) door Cameron McCormack
Browser-ondersteuning
Deze browserondersteuningsgegevens zijn van Caniuse, die meer details bevat. Een getal geeft aan dat de browser de functie ondersteunt vanaf die versie.
Bureaublad
Chrome | Firefox | D.W.Z | Rand | Safari |
---|---|---|---|---|
37 | 27 | Nee | 79 | 9.1 |
Mobiel / tablet
Android Chrome | Android Firefox | Android | iOS Safari |
---|---|---|---|
88 | 85 | 4.4.3-4.4.4 | 9.3 |