防止iPhone在web应用程序中缩放`select`。

Question

防止iPhone在web应用程序中缩放`select`。

100

我有这段代码:

<select>
    <option value="c">Klassen</option>
    <option value="t">Docenten</option>
    <option value="r">Lokalen</option>
    <option value="s">Leerlingen</option>
</select>

在iPhone上以全屏web应用程序运行。

当从此列表中选择某个内容时，iPhone会放大select元素。并且在选择完内容后不会缩小回去。

我该如何防止这种情况发生？或者缩小回去？

- seymar

12个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- daxmacrog · Answer 1

如下所述：在iPhone的Safari中禁用“Text”标记中的自动缩放

您可以通过添加maximum-scale = 1但不包括其他答案中建议的用户比例属性，而无需禁用用户的捏缩放功能，防止Safari在用户输入期间自动缩放文本字段。

如果您有一个“浮动”的图层中的表单，如果进行缩放，可能会导致重要的UI元素移动到屏幕外面，则这是一个值得考虑的选项。

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

- Abdul Sheikh · Answer 2

尝试添加此CSS以禁用iOS的默认样式：

-webkit-appearance: none;

这也适用于其他需要特殊样式的元素，例如input[type=search]。