Comment masquer correctement la flèche déroulante de sélection dans Firefox ?

Correction de « -moz-apparence » pour la dissimulation de la flèche déroulante de sélection

Problème :

Vous essayez de personnaliser la flèche déroulante d'un élément de sélection en utilisant CSS dans Chrome et Firefox. Alors que votre syntaxe "-webkit-" fonctionne parfaitement dans Chrome/Safari, ses homologues "-moz-" ne cachent pas la flèche déroulante dans Firefox. "-moz-apparence : aucune ;" ne parvient pas non plus à supprimer la flèche par défaut.

Solution :

La valeur correcte "-moz-apparence" pour éliminer la flèche déroulante est "-moz- apparence : aucune ;." Cependant, cette propriété, ainsi que « -moz-apparence : bouton ; » est désormais un contenu hérité. À partir de Firefox v35, il prend en charge la propriété « apparence » améliorée, permettant une solution plus simple :

<code class="css">select {
  appearance: none;
}</code>

Piratage alternatif (pré-Firefox v35) :

Avant Firefox v35, un hack CSS a été nécessaire pour masquer la flèche :

<code class="css">select {
  -moz-appearance: none;
  text-indent: 0.01px;
  text-overflow: '';
}</code>

Cette méthode décale légèrement la flèche vers la droite, provoquant le débordement pour l'éliminer.

Mises à jour :

• 11 décembre 2014 : "-moz-apparence:none" est désormais pris en charge dans Firefox v35.
• 28 avril 2014 : Le hack mentionné ci-dessus a temporairement mal fonctionné dans Firefox 31.0.a1 Nightly ; cependant, le problème a été résolu.

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!