Wie deaktiviere ich die Rundung von Eingabeelementen in Safari?

Deaktivieren Sie die Rundung von Eingabeelementen in Safari

Beim Entwickeln von Websites für das iPhone und den Safari-Browser kann es zu einem Problem kommen, bei dem Texteingabefelder angezeigt werden ein störend abgerundetes Erscheinungsbild, das im Widerspruch zum Gesamtdesign der Website steht.

Um dieses Problem zu beheben und die Eingabefelder in der beabsichtigten rechteckigen Form darzustellen, weisen Sie Safari mit dem folgenden CSS-Code an:

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

Verwenden Sie für Eingabefelder, die für Suchzwecke bestimmt sind, das folgende zusätzliche CSS:

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

Wenn die Entfernung der Rundung auf iOS-Geräte beschränkt werden muss, verwenden Sie den -webkit-border-radius: 0; Eigentum. Beachten Sie jedoch, dass Apple möglicherweise in Zukunft keine Präfixeigenschaften mehr unterstützt.

Für ältere Versionen von iOS verwenden Sie -webkit-appearance: none; stattdessen:

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

Das obige ist der detaillierte Inhalt vonWie deaktiviere ich die Rundung von Eingabeelementen in Safari?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!