持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第5天，点击查看活动详情
1. 问题描述
input 输入框在 Android 系统可以输入和点击，但是在 iOS 系统上 input 输入框无法点击和输入。
2. 解决方法
方案一：在代码中查找并去掉下列样式
-webkit-touch-callout:none;
-webkit-user-select:none;
方案二：使用 not 选择器匹配不是 input, textarea 标签的每个元素
*:not(input, textarea) {
-webkit-touch-callout: none;
-webkit-user-select: none;
}
3. 拓展知识
关于 user-select 属性
定义和用法
user-select 属性规定是否能选取元素的文本。 在 web 浏览器中，如果您在文本上双击，文本会被选取或高亮显示。此属性用于阻止这种行为。
语法
user-select: auto|none|text|all;
JavaScript 语法：
object.style.userSelect="none"
属性值
| 值 | 描述 |
|---|---|
| auto | 默认。如果浏览器允许，则可以选择文本。 |
| none | 防止文本选取。 |
| text | 文本可被用户选取。 |
| all | 单击选取文本，而不是双击。 |
兼容性：
表格中的数字注明了完全支持该属性的首个浏览器版本。
跟随 -webkit-、-ms- 或 -moz- 的数字规定使用前缀的首个版本。
| 属性 | chrome | IE | Firefox | Safari | opera |
|---|---|---|---|---|---|
| user-select | 54.06.0 -webkit- | 79.010.0 -ms- | 69.02.0 -moz- | 3.1 -webkit- | 41.015.0 -webkit- |
关于 -webkit-touch-callout 属性
注意：该特性是非标准的，请尽量不要在生产环境中使用它！
概述：-webkit-touch-callout 这个CSS 属性禁用了默认的callout展示， callout 是指当触摸并按住一个元素的时候出现的提示。
当在iOS上一直按住一个目标元素时，Safari会展示一个关于这个链接的callout信息。webkit-touch-callout 属性允许禁用掉这一行为。
语法：
-webkit-touch-callout: default /* 显示标注 */
-webkit-touch-callout: none /* 禁用标注 */
-webkit-touch-callout: initial
-webkit-touch-callout: inherit
-webkit-touch-callout: unset
示例：
.example {
-webkit-touch-callout: none;
}
兼容性：
不是任何规范的一部分。
iOS 2.0及更高版本的Safari浏览器可用
Android尚不明确
