Autrefois caché et réservé pour certains usages internes, les préfixes de navigateur sont maintenant recommandés d'être utilisé par le w3c. Pour quelle raison ? Certaines propriétés n'étaient pas standard autrefois, et finissent par le devenir. De plus, certains navigateurs évoluent moins vite que d'autres, il ne faudrait pas, par exemple, que l'internaute tombe sur une page blanche à cause que certaines propriétés sont mal supportées. De plus, il est souhaitable d'utiliser ses préfixes afin de permettre une intégration progressive des CSS 2.1 et CSS3.
Préfixe | Prérequis | Supplément |
---|---|---|
mso- | Microsoft Office | mso-footer-margin, mso-header-margin, mso-ignore, mso-margin-top-alt, mso-page-orientation, mso-pagination, mso-style-name |
prince- | Le formateur Prince de YesLogic | |
-ah- | Le formateur Antenna House | |
-apple- | Webkit d'Apple | |
-atsc- | Comité de standard de télévision avancé | |
-chrome- | Navigateur Chrome | |
-hp- | Produit de Hewlett Packard | |
-khtml- | Navigateur Konqueror (KHTML) | -khtml-opacity,... |
-moz- | Navigateur Mozilla (Gecko) | -moz-background-size, -moz-border-radius,... |
-ms- | Microsoft (Internet Explorer,...) | -ms-word-wrap,... |
-o- | Navigateur Opera | -o-umbrella-radius,... |
-prefix-free | Utiliser le code source JavaScript de «prefixfree.min.js» sur le site http://leaverou.github.com/prefixfree/ | |
-rim- | Les produits de Research In Motion | |
-ro- | Objets réels | |
-tc- | Composantes de grandes tailles | |
-wap- | Forum WAP | -o-umbrella-radius,... |
-webkit- | Les Webkits (Chrome, Safari, Android,...) | -webkit-box-align, -webkit-box-direction, -webkit-box-flex, -webkit-box-flex-group,... |
N.B. : Certaines personnes ne sont pas d'accord avec l'idée des préfixes, on voit déjà apparaitre des bibliothèques de code JavaScript (prefixfree, CSS3Pie,...) permettant de contourner le problème.
Si vous mettez des propriétés non officiellement supportées et que vous mettez la propriété sans le préfixe, assurez-vous que la propriété sans le préfixe soit située après. Exemple : «-webkit-box-align : baseline; box-align: baseline;».