1移动端输入六位密码 光标位置不对
解决办法,把它移到看不见的地方input{ text-indent: -999em; margin-left: -100%; width: 200%!important; } 2 textarea 文本域 resize: none; //禁止放大 overflow-y: hidden; //进度条 3 遮罩层 .shelter{ position: fixed; top: 0%; left: 0%; width: 100%; height: 100%; z-index: 10; display: none; } 4 打电话,发短信 <a href="tel:0755-10086">打电话给:0755-10086</a> <a href="sms:10086">发短信给: 10086</a> 5 rem px 移动端适配问题 移动端字体单位font-size选择px还是rem 对于只需要适配少部分手机设备,且分辨率对页面影响不大的,使用px即可 对于需要适配各种移动设备,使用rem,例如只需要适配iPhone和iPad等分辨率差别比较大的设备 @media screen and (max-width: 321px) { body { font-size: 16px; } } @media screen and (min-width: 321px) and (max-width: 400px) { body { font-size: 17px; } } @media screen and (min-width: 400px) { body { font-size: 19px; } } <script> // px与rem单位的换算 (function(){ document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + ‘px‘; })(); </script> 6 可输入的div <--输入完后,准备点击确定按钮回复--> <div contenteditable="true" data-id="+result.id+" class="shopReply">回复买家</div> <--已回复买家的评价--> <div contenteditable="false" data-id="+result.id+" class="shopReply">谢谢您,我们会更好的为您服务</div> div上模拟placeholder <div id="content" class="inputcontent needsclick" placeholder="有问题就尽管提问吧" contenteditable="true"></div> <style> .inputcontent:after { display: inline-block; width: 100%; color: #999; content: attr(placeholder); } </style> 7 重定向 重定向是网页制作中的一个知识,几个例子跟你说明,假设你现在所处的位置是一个论坛的登录页面,你填写了帐号,密码,点击登陆,如果你的帐号密码正确,就自动跳转到论坛的首页,不正确就返回登录页;这里的自动跳转,就是重定向的意思。或者可以说,重定向就是,在网页上设置一个约束条件,条件满足,就自动转入到其它网页、网址。 window.location.href = ‘goods_management.html?tab=audit‘; 8 input文本框输入数字时,小数点后面只保留2位 $(‘#goodsPrice‘).blur(function() { var money = $(this).val() - 0.0; $(this).val(money.toFixed(2)); }); 9 刷新当前页面 window.location.reload(): //刷新当前页面 <meta http-equiv="refresh" content="3600"> //1小时刷新一次 10 移动端 1px border 实现 部分安卓机器(比如小米)的分辨率低,如果border的宽度小于1px。安卓机出现一种边框消失了的现象。样式上有点奇怪,IOS没有这个问题。 由于设备高分辨率屏的原因,逻辑像素的 1px 的 border 在移动设备上会用两个或三个物理像素来表示,所以看起来会感觉很粗。解决方案有很多,但兼容性最好的方案是用伪元素的 box-shadow 或 border 实现 border,然后用 transform: scale(.5) 缩小到原来的一半 11 阻止旋转屏幕时自动调整字体大小 * { -webkit-text-size-adjust: none; } 禁止 iOS 识别长串数字为电话 <meta name="format-detection" content="telephone=no" /> input的placeholder会出现文本位置偏上的情况 line-height:normal; 12 键盘 <input type="number" pattern="[0-9]*" /> <input type="password" pattern="[0-9]*" /> 注意:只有number或者tel还是不够,只有加入正则,ios才会出现九宫格 13 flex布局 display: flex; display: -webkit-box; display: -webkit-flex; 注: 如果用flx布局必须要加,不加的话,ios版本为8的机子页面会错乱 可以进群领取资料的哦~WEB前端学习交流群21 598399936 |