Pourquoi mon image d'arrière-plan de sélection/déroulage ne fonctionne-t-elle pas dans Chrome ?

L'image d'arrière-plan pour la sélection/la liste déroulante ne fonctionne pas dans Chrome

Dans le but d'améliorer l'attrait visuel d'une page Web, vous rencontrez un problème où une image d'arrière-plan destinée à un élément de sélection/liste déroulante ne s'affiche pas dans Google Chrome. Bien que le CSS fourni ci-dessous fonctionne parfaitement dans Firefox et Internet Explorer, il ne s'affiche pas dans Chrome.

<code class="CSS">#main .drop-down-loc {
  width: 506px;
  height: 30px;
  border: none;
  background-color: Transparent;
  background: url(images/text-field.gif) no-repeat 0 0;
  padding: 4px;
  line-height: 21px;
}</code>

Solution :

Pour résoudre ce problème dans Chrome, vous pouvez utiliser le code CSS suivant :

<code class="CSS">select {
    -webkit-appearance: none;
}</code>

Cette propriété CSS supprime le style par défaut de Chrome pour certains éléments, vous permettant ainsi d'appliquer un style personnalisé, y compris les images d'arrière-plan.

De plus, si vous le souhaitez une flèche dans le cadre de l'arrière-plan, vous pouvez inclure une image qui l'incorpore dans l'image d'arrière-plan personnalisée.

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!