Warum funktioniert mein ausgewähltes/Dropdown-Hintergrundbild in Chrome nicht?

Hintergrundbild für Auswahl/Dropdown funktioniert in Chrome nicht

Beim Versuch, die visuelle Attraktivität einer Webseite zu verbessern, stoßen Sie auf ein Problem, bei dem ein Hintergrundbild, das für ein Auswahl-/Dropdown-Element vorgesehen ist, in Google Chrome nicht gerendert wird. Während das unten bereitgestellte CSS in Firefox und Internet Explorer einwandfrei funktioniert, wird es in Chrome nicht angezeigt.

<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>

Lösung:

Um dieses Problem in Chrome zu beheben, Sie können den folgenden CSS-Code verwenden:

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

Diese CSS-Eigenschaft entfernt den Standardstil von Chrome für ausgewählte Elemente und ermöglicht Ihnen die Anwendung eines benutzerdefinierten Stils, einschließlich Hintergrundbildern.

Zusätzlich, wenn Sie es benötigen Wenn Sie einen Pfeil als Teil des Hintergrunds verwenden, können Sie ein Bild einfügen, das ihn in das benutzerdefinierte Hintergrundbild integriert.

Das obige ist der detaillierte Inhalt vonWarum funktioniert mein ausgewähltes/Dropdown-Hintergrundbild in Chrome nicht?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!