移动端开发的一些小技巧

1.常用的meta标签

// 文档宽度调整为设备宽度并且不允许用户缩放浏览
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">  
// 在ios设备上允许全屏浏览
<meta content="yes" name="apple-mobile-web-app-capable">  
// ios设备中safari顶部的状态条样式                                                 
<meta content="black" name="apple-mobile-web-app-status-bar-style">   
// 忽略数字识别为电话号码                                    
<meta content="telephone=no" name="format-detection">       
// Android中不识别邮件                                               
<meta content="email=no" name="format-detection" /> 

2.关闭ios中键盘自动大写

用过ios系统的都知道,每次键盘呼出都是大写,这里可以使用input元素的autocapitalize="off"来关闭键盘默认首字母大写

<input type="text" autocapitalize="off">     

3.ios中禁止用户保存图片或者复制图片

为img标签添加一个属性-webkit-touch-callout设置为none

<img src="../images/logo.png" alt="" -webkit-touch-callout="none">  

4.ios中禁止用户选中文字

在文字标签上添加-webkit-user-select设置为none

<p -webkit-user-select="none">我是文章哦</p>   


猜你喜欢

转载自blog.csdn.net/u014307349/article/details/78509996