前言
移动端由于输入屏幕较小,输入不太方便。如果能够设计出更合理的软键盘,那么就会增加用户的易用性。例如,在输入数字的时候,软键盘中只有数字,而不需要用户自己去切换;在输入密码的时候,关闭自动大写首字母。input标签的type类型就能简单的自定义软键盘。
关键知识点<input type="number" />
如上代码,在移动端打开此页面,点击这个input,会出来如下软键盘:
<input type="tel" />
如上代码,在移动端打开此页面,点击这个input,会出来如下软键盘:
示例请手机或者平板打开此页面
总结- 很多手机都支持tel number search email url,正则除外
- 不支持的话,对样式表现没什么影响,可以放心使用
- 对待输入我们一般都是一路off到底,移动web端input标配属性:
autocapitalize="off" autocomplete="off" autocorrect="off" spellcheck="false"
参考
点击查看更多内容
17人点赞
评论
共同学习,写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦