Wie kann ich die Drehschaltflächen aus Zahleneingabefeldern in WebKit-Browsern entfernen?

Überschreiben der Spin-Buttons von Webkit beim Eingabetyp „Zahl“

Mobile Safari bietet eine für Mobilgeräte optimierte numerische Tastatur für Eingabefelder mit der Bezeichnung „Zahl“. " Typ. Auf Chrome und Safari verwenden Browserplattformen jedoch Drehschaltflächen, um die angezeigte Zahl zu erhöhen oder zu verringern, was bestimmte Designästhetiken beeinträchtigen kann.

Um diese Drehschaltflächen zu deaktivieren, können CSS-Techniken eingesetzt werden. Die Lösung besteht darin, das Erscheinungsbild und den Rand des Eingabefeld-Spinners zu ändern:

input[type=number]::-webkit-outer-spin-button {</p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">-webkit-appearance: none;
margin: 0;

Nach dem Login kopieren

}

Wenn Sie -webkit-appearance auf „none“ setzen, werden die Drehschaltflächen optisch ausgeblendet. Darüber hinaus stellt die Einstellung des Rands auf 0 sicher, dass rechts vom Eingabefeld kein unnötiger Abstand vorhanden ist. Diese Lösung verbirgt effektiv die Drehschaltflächen und passt das Erscheinungsbild der Eingabe an die Designanforderungen an.

Das obige ist der detaillierte Inhalt vonWie kann ich die Drehschaltflächen aus Zahleneingabefeldern in WebKit-Browsern entfernen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!