移动端常见问题一
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,user-scalable=no" /> <!--x5内核浏览器 (qq) 强制竖屏显示--> <meta name="x5-orientation" content="portrait" /> <!--x5内核浏览器 (qq) 全屏显示--> <meta name="x5-fullscreen" content="true" /> <!--禁止电话号码识别和邮箱识别--> <!--<meta name="format-detection" content="telephone=no,email=no" />--> <title></title> <style> #box{ width: 100px; height: 100px; background: red; } /*设置字体*/ body{ /*默认字体设置*/ font-family: helvetica; } body *{ /*禁止字体缩放*/ -webkit-text-size-adjust: 100%; } a, input, button{ /*清除点击阴影*/ /*全透明色*/ -webkit-tap-highlight-color:rgba(0,0,0,0); } input, button{ /*清除圆角*/ -webkit-appearance: none; border-radius:0; } /*Foot Boosting 在一段文字我们没有给他设置高度的时候,在webkit内核下,文字的大小被浏览器放大了 解决办法: 1.设置高度 2.设置最大高度 max-height*/ </style> <script> // alert(window.devicePixelRatio); //n=window.devicePixelRatio; //把一个像素放大至n个像素去显示 //设计图最少750 </script> </head> <body> 这是我的第一个移动端页面 <div id="box"></div> <p>442564584</p> <!--拨打电话--> <a href="tel:110">请拨打电话:</a> <!--发送邮件--> <a href="mailto:285617424@qq.com">请发送邮件</a> <br /> <!--a连接,按钮,移动端点击的时候有灰色背景--> <a href="http://www.baidu.com">百度</a> <!--真机上按钮会变成圆角--> <input type="button" value="按钮" /> </body> </html>