Wie kann ich abgerundete Eingabeelemente in iPhone/Safari deaktivieren?

Abgerundete Eingabeelemente in iPhone/Safari deaktivieren

Safari auf iOS-Geräten neigt dazu, Texteingabefelder mit einem abgerundeten Stil darzustellen, was möglicherweise nicht der Fall ist immer am beabsichtigten Design ausrichten. Um dieses Problem zu beheben, erfahren Sie hier, wie Sie Safari anweisen, die Eingabefelder nicht abzurunden und rechteckig darzustellen:

Für iOS 5 und höher:

1. CSS-Stil:

Verwenden Sie die CSS-Regel border-radius: 0; um die abgerundeten Ecken aller Eingabefelder zu entfernen.

2. WebKit-Erscheinungsbild:

Setzen Sie speziell für das Sucheingabefeld die Eigenschaft -webkit-appearance auf „Keine“.

<code class="css">input {
  border-radius: 0;
}

input[type="search"] {
  -webkit-appearance: none;
}</code>

Für ältere Safari-Versionen:

WebKit-Erscheinungsbild:

Verwenden Sie in älteren Versionen von Safari die Eigenschaft -webkit-appearance: none für alle Eingabefelder, um den abgerundeten Stil zu entfernen.

<code class="css">input {
  -webkit-appearance: none;
}</code>

Hinweis:

• Der -webkit-border-radius: 0; Die Eigenschaft kann nur für die Ausrichtung auf Eingabefelder unter iOS verwendet werden, wird jedoch möglicherweise in Zukunft eingestellt.
• Die bevorzugte Methode besteht darin, abgerundete Ecken plattformübergreifend zu normalisieren, indem die Standardeigenschaft border-radius und das -webkit- verwendet werden. Erscheinungseigenschaft nur für Safari.

Das obige ist der detaillierte Inhalt vonWie kann ich abgerundete Eingabeelemente in iPhone/Safari deaktivieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!