如何去除 iPhone/Safari 中輸入欄位的圓角？

消除iPhone/Safari 輸入元素舍入

輸入欄位通常在iPhone/Safari 瀏覽器中呈現圓形外觀，與所需的效果相衝突矩形設計。本文深入探討透過 CSS 或元資料修改輸入元素樣式的方法。

iOS 5 及更高版本的解決方案：

在iOS 5 及更高版本上刪除圓角，實現以下CSS：

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

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

替代方法：

針對iOS 特定的圓角去除，或者在跨平台規範化不可行的情況下，請考慮以下CSS：

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

但是，請注意，對此類前綴屬性的支援將來可能會停止。

舊版瀏覽器解決方案：

對於較舊的 iOS 版本，需要使用 -webkit-appearance 屬性：

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

以上是如何去除 iPhone/Safari 中輸入欄位的圓角？的詳細內容。更多資訊請關注PHP中文網其他相關文章！