踩过的坑—iphone手机H5样式兼容总结
对一个前端开发者来说,最煎熬的莫过于"兼容"两个字了(说到这个词朋友们是不是身体一抖),哪怕对于工作多年的老油条来讲,也不是完全了解各种场景下的兼容性处理方法。在这里我就把我在工作当中遇到的关于iphone手机h5页面的兼容性处理和大家分享一下。
html,body{ -webkit-text-size-adjust: none; } // 当需要在中文版chrome浏览器中显示小于12px的字体时,而且此时页面放大效果会被阻止
html,body{ -webkit-tap-highlight-color: rgba(0,0,0,0); } // 去掉苹果手机点击瞬间出现的灰色背景
input{ -webkit-appearance: none; } // 去除苹果手机默认的input样式(默认样式可丑了ಥ﹏ಥ)
selector{ cursor: pointer } // 给IOS系统里cursor不为pointer的元素添加事件时会不同程度受影响,加上cursor: pointer可解决
img{ pointer-events: none; } // 阻止图片在微信里被点击放大
……
好了,能力有限,目前遇到的就这么多,当然兼容性问题还有千千万,欢迎大家来补充~
踩过的坑—iphone手机H5样式兼容总结的更多相关文章
- iphone手机不同版本兼容、横竖屏
/* 兼容问题*/ @media screen and (device-width: 320px) and (device-height: 480px) and (-webkit-device-pix ...
- 排坑·IPhone&IOS中不兼容正则中的断言匹配
阅文时长 | 1.14分钟 字数统计 | 1834.4字符 主要内容 | 1.问题切入 2.什么是断言匹配 3.断言匹配的替换方案 4.声明与参考资料 『排坑·IPhone&IOS中不兼容正则 ...
- 禁用iPhone手机浏览器上给电话号码自动加上的link样式
iPhone手机上的浏览器(如Safari),在解析网页的时候会自动给 像是电话号码的数字 加上link样式. 可以添加下面的meta禁用掉这个功能. // //
- 禁用iPhone手机浏览器上给电话号码自动加上的link样式(苹果手机自动给手机号加样式)
原文地址:http://blog.csdn.net/atec2000/article/details/44631633 iPhone手机上的浏览器(如Safari),在解析网页的时候会自动给 像是电话 ...
- Dcloud开发webApp踩过的坑
Dcloud开发webApp踩过的坑 一.总结 一句话总结:HTML5+扩展了JavaScript对象plus,使得js可以调用各种浏览器无法实现或实现不佳的系统能力,设备能力如摄像头.陀螺仪.文件系 ...
- 微信支付之手机H5支付实践
最近项目中支付部分涉及到微信支付,使用的是h5支付,官方文档中是没有demo的,所以摸着石头过河,将踩过的坑记录如下. 一 应用场景 H5支付是指商户在微信客户端外的移动端网页展示商品或服务,用户在前 ...
- 那些移动端web踩过的坑
原文链接:https://geniuspeng.github.io/2017/08/24/mobile-issues/ 扔了N久,还是捡回来了.好好弄一下吧.刚工作的时候挺忙的,后来不那么忙了,但是变 ...
- 那些年踩过的坑之:first-child伪类选择器
原文:那些年踩过的坑之:first-child伪类选择器 :first-child 选择器用于选取属于其父元素的首个子元素的指定选择器.——w3school 嗯,乍一看好像说的不是很明白,因此这个选择 ...
- iphone手机中对于html和css的一些特殊处理
1.iphone safari iso系统不兼容:hover的解决办法: 方法一: a:hover设置的样式在IOS系统的浏览器内显示不出来,看来是IOS系统的移动设备中,需要在按钮元素或者是body ...
随机推荐
- 自定义组件Component
定义compa组件 由4个页面构成 compa.js: compa.json: compa.wxml: compa:wxss: 1.compa.json:在json文件进行自定义组件声明 { &quo ...
- react用class关键字来创建组件
创建组件之前,首先学习一个ES6的写法,叫做展开运算符. 比如我这里有两个数组.如何将第二个数组o2中的所有属性导入到数组o1中呢?一个个输太麻烦,所以就用到了展开运算符. var o2={ age: ...
- Java线程的创建方式三:Callable(四)
一.Java实现多线程的三种方式 方式一:继承Thread类: public class Test extends Thread { public static void main(String[] ...
- 【python练习题】程序15
#题目:利用条件运算符的嵌套来完成此题:学习成绩>=90分的同学用A表示,60-89分之间的用B表示,60分以下的用C表示. n = input('请输入成绩 :') n = int(n) if ...
- ajax 的json格式
我们平时使用ajax向后台传递数据时,通常会传递json格式的数据,当然这里还有其它格式,比如xml.html.script.text.jsonp格式. json类型的数据包含json对象和json类 ...
- Cetos 7 防火墙设置
1.关闭防火墙: # systemctl stop firewalld.service 2.开启防火墙: # systemctl start firewalld.service 3.关闭开机启动: # ...
- Python中xlwt解析
1.导入模块 import xlwt 2.构造excel表 workbook = xlwt.Workbook() #返回一个工作簿对象 3.构造sheet w ...
- Tarjan求强连通分量,缩点,割点
Tarjan算法是由美国著名计算机专家发明的,其主要特点就是可以求强连通分量和缩点·割点. 而强联通分量便是在一个图中如果有一个子图,且这个子图中所有的点都可以相互到达,这个子图便是一个强连通分量,并 ...
- Nagios故障 CHECK_NRPE: Socket timeout after 10 seconds.
Nagios 的警报信息如下,意思是 nrpe 进程执行某些脚本超过了 10 秒钟,就会发警报 CHECK_NRPE: Socket timeout after 10 seconds 修改 comma ...
- 洛谷AT2046 Namori(思维,基环树,树形DP)
洛谷题目传送门 神仙思维题还是要写点东西才好. 树 每次操作把相邻且同色的点反色,直接这样思考会发现状态有很强的后效性,没办法考虑转移. 因为树是二分图,所以我们转化模型:在树的奇数层的所有点上都有一 ...