Que sont les préfixes -webkit- et -moz- en CSS et comment doivent-ils être utilisés ?

Comprendre les préfixes -moz- et -webkit-

Lorsque vous rencontrez du code CSS avec des préfixes comme "-webkit-" ou "-moz- ", il est essentiel de comprendre leur objectif. Ces préfixes sont des propriétés spécifiques au fournisseur qui permettent la mise en œuvre de fonctionnalités CSS émergentes ou propriétaires avant leur standardisation par le W3.

Avantages des préfixes du fournisseur

Ces préfixes permettent navigateurs pour tester de nouvelles fonctionnalités et tenir compte des incohérences dans les différents moteurs de rendu. À mesure que la compatibilité des navigateurs s'améliore, les préfixes sont progressivement supprimés une fois que les versions finales des propriétés sont prises en charge.

Bonnes pratiques d'utilisation des préfixes

Il est recommandé d'utiliser le préfixe du fournisseur versions des propriétés d'abord, puis effectuez un suivi avec les versions non préfixées. Cela garantit que la propriété sans préfixe remplacera les paramètres préfixés une fois pris en charge dans le navigateur. Par exemple :

.elementClass {
    -moz-border-radius: 2em;
    -ms-border-radius: 2em;
    -o-border-radius: 2em;
    -webkit-border-radius: 2em;
    border-radius: 2em;
}

Exemple spécifique

Dans votre code CSS fourni :

-webkit-column-count: 3;
-webkit-column-gap: 10px;
-webkit-column-fill: auto;
-moz-column-count: 3;
-moz-column-gap: 10px;
-moz-column-fill: auto;

Ces propriétés préfixées définissent le nombre de colonnes, attributs column-gap et column-fill pour les navigateurs Webkit et Firefox.

Références

• Module de mise en page multi-colonnes CSS
• 'Pour la défense des préfixes des fournisseurs' (Meyerweb.com)
• Listes de préfixes de fournisseurs (Meyerweb.com)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!