Vendorprefixes in CSS
In het verleden was de situatie onder browsers als volgt: voordat een CSS-eigenschap in de specificatie verschijnt, implementeerden browsers een proefversie van deze eigenschap met een speciaal voorvoegsel, dat een vendorprefix wordt genoemd.
Laten we eens kijken naar het voorbeeld van de eigenschap
box-sizing
om te zien hoe dit eruitziet:
p {
box-sizing: border-box;
}
Deze eigenschap werd alleen ondersteund vanaf Firefox29,
maar vanaf versie Firefox2 was het al beschikbaar
met het prefix -moz:
p {
-moz-box-sizing: border-box;
}
Andere browsers hadden vergelijkbare voorvoegsels:
-moz - Mozilla Firefox, -webkit
- browsers op de Webkit- en Blink-engine, -o
- Opera op de Presto-engine, -ms - IE.
Dus de meest cross-browser versie van de
eigenschap box-sizing, met gebruikmaking
van vendorprefixes, zag er ongeveer als volgt uit:
p {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
}
Tegenwoordig hebben browsers besloten af te stappen van prefixes vanwege hun onhandigheid. En in plaats daarvan gebruiken ze nu zogenaamde vlaggen. Eigenschappen worden nu geïmplementeerd in de browser, maar standaard uitgeschakeld, echter ze kunnen worden ingeschakeld in de browserinstellingen, door het corresponderende vinkje in de instellingen aan te zetten. Dit is gedaan zodat ontwikkelaars de mogelijkheid hebben om met de nieuwe eigenschap te experimenteren voordat deze officieel verschijnt.