关闭iPhone / Safari输入元素舍入

Question

我的网站在iPhone / Safari浏览器上的呈现效果很好，但有一个例外：我的文本输入字段具有一种怪异的圆形样式，与我的网站的其余部分完全不一样。

有没有一种方法可以指示Safari（通过CSS或元数据）不对输入字段进行舍入并按预期将其呈现为矩形？

Answer 1

在iOS 5及更高版本上，出色border-radius的技巧可以解决问题：

input {
    border-radius: 0;
}

如果必须仅在iOS上删除圆角，否则由于某些原因不能在跨平台标准化圆角，请改用prefixed -webkit-border- radius属性，该属性仍受支持。当然，请注意，Apple可以随时选择放弃对prefix属性的支持，但考虑到其其他特定于平台的CSS功能，他们会保留它的机会。

在旧版中，您必须设置-webkit-appearance: none：

input {
    -webkit-appearance: none;
}