Wie entferne ich abgerundete Ecken aus Texteingabefeldern auf dem iPhone/Safari?

Deaktivieren Sie die Rundung von Eingabeelementen auf dem iPhone/Safari

Auf bestimmten Websites kann ein Problem auftreten, bei dem Texteingabefelder auf dem iPhone/ Safari-Browser. Dies kann mit dem beabsichtigten Design der Website in Konflikt geraten.

CSS-Lösung

Um die abgerundeten Ecken speziell in Safari zu entfernen, ohne andere Browser zu beeinträchtigen, ändern Sie den Stil des Eingabeelements Verwenden von CSS:

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

Zusätzliches CSS für Sucheingaben

Für Sucheingabefelder ist eine zusätzliche Eigenschaft erforderlich:

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

Ältere iOS-Versionen

Für ältere iOS-Versionen (vor iOS 5) verwenden Sie stattdessen die folgende CSS-Eigenschaft:

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

Hinweis: Für Kompatibilität zwischen verschiedenen Browsern und Plattformen. Erwägen Sie die Normalisierung abgerundeter Ecken mithilfe der Eigenschaft „border-radius“, da Apple die Unterstützung für die vorangestellte Eigenschaft „-webkit-border-radius“ in Zukunft möglicherweise nicht mehr unterstützt.

Das obige ist der detaillierte Inhalt vonWie entferne ich abgerundete Ecken aus Texteingabefeldern auf dem iPhone/Safari?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!