Pourquoi ne puis-je pas combiner des pseudo-éléments et classes spécifiques au fournisseur dans une seule règle CSS ?

Mélanger des pseudo-éléments et des classes spécifiques au fournisseur en CSS

En CSS, nous utilisons souvent des pseudo-éléments et des classes spécifiques au fournisseur pour améliorer la compatibilité du navigateur. Cependant, il n'est pas possible de les combiner en un seul ensemble de règles malgré le partage de propriétés similaires.

Pourquoi pas ?

CSS2.1 stipule qu'un sélecteur doit être valide avant le l'agent utilisateur applique le bloc de déclaration. Le préfixe des noms de fournisseurs dans les sélecteurs introduit des caractères non reconnus pour certains navigateurs. Par conséquent, les agents utilisateurs doivent abandonner ces règles pour maintenir leur validité.

Plus précisément :

• Les navigateurs des fournisseurs ne comprennent pas les préfixes des autres.
• Un sélecteur séparé par des virgules contenant des préfixes de fournisseur aura au moins un sélecteur méconnaissable pour chaque navigateur, ce qui entraînera la suppression de la règle entière. ignoré.

Impact sur le style

Lors du style du texte d'espace réservé, par exemple, cette limitation nous oblige à écrire plusieurs règles redondantes, car chaque fournisseur nécessite une règle distincte préfixe :

input:-moz-placeholder {
  font-style: italic;
  text-align: right;
}
input::-moz-placeholder {
  font-style: italic;
  text-align: right;
}
input:-ms-input-placeholder {
  font-style: italic;
  text-align: right;
}
input::-webkit-input-placeholder {
  font-style: italic;
  text-align: right;
}

Conclusion

Comprendre cette limitation nous permet de créer des styles CSS valides et cohérents. Bien que les préfixes des fournisseurs soient parfois nécessaires à la compatibilité des navigateurs, les mélanger dans un seul ensemble de règles reste impossible en raison des règles d'analyse spécifiques au navigateur.

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!