先mark

1 .  移动端uc浏览器不兼容css3 calc()

2 .  ie8下a标签没有内容给宽高也不能触发点击跳转

3 . safari输入框加上readOnly="ture"属性仍然可以触发获取焦点，可再加上onfocus="this.blur()“解决

4 .  animate在移动端卡顿严重，移动端运动要用css3实现

5 .  ios下伪类事件失效，可给当前元素的touchstart/touchend事件绑定一个空匿名函数 解决

6 . 移动端或webapp下点击元素背景变蓝，可给点击元素或body加-webkit-tap- highlight-color:transparent;解决

7 . ios下点击事件失效，可给点击元素加cursor:pointer;解决

8 . display:flex在uc端需做兼容处理，父级为：

display:-webkit-box;display:flex;display:-webkit-flex;

　　子级为：

-webkit-box-flex:1;-webkit-flex:1;flex:1;

　　可兼容safari、微信、uc三种最大用户群

9 . 清除苹果下button按钮的默认样式：-webkit-appearance: none;

10 .当移动端想要截取图片为正方形又不想缩放时，可给图片一个父级，给父级相同宽高再溢出隐藏，高度如何与宽度保持一致便成了最关键的问题，虽然js一行就可以搞定，但是我们总监坚持不用js就不让用js，所以css单位 vw便派上用场了。

　　vw是相对于窗口的单位，100vw相当于100%窗口的宽度，这样高度和宽度就可以同步设置，比如：width:30vw;height:30vw;

　　项目地址为：m.tn.ccoo.cn/tieba/

苹果浏览器和uc浏览器在移动端的坑（日常积累，随时更新）的更多相关文章

  1. H5手机移动端调起浏览器（qq浏览器，uc浏览器）自带分享功能实例

    H5手机移动端调起浏览器(qq浏览器,uc浏览器)自带分享功能实例 (转载:https://blog.csdn.net/weixin_38787928/article/details/86741227 ...

  2. 怎么判断是qq浏览器还是uc浏览器?

    这里我画红框的是不正确的,最好的办法就是打印出navigator.userAgent出来.uc浏览器检验是正确的.

  3. 判断qq浏览器和uc浏览器？

    判断在iphone手机上打开的是uc浏览器还是qq浏览器 <html lang="en"> <head> <meta charset="ut ...

  4. 求助：为什么我用360浏览器和UC浏览器打不开JAVA中的index.html文件? 一打开就显示浏览器首界页

    如下图,在oracle官网下载了一个JAVA的API文档,双击index.html时打开是浏览器的首页,不知道为什么?请问怎样才能以chm文档格式显示?

  5. android -------- 打开本地浏览器或指定浏览器加载，打电话，打开第三方app

    开发中常常有打开本地浏览器加载url或者指定浏览器加载, 还有打开第三方app, 如 打开高德地图 百度地图等 在Android程序中我们可以通过发送隐式Intent来启动系统默认的浏览器. 如果手机 ...

  6. 关于浏览器ip代理导致定位错乱问题的坑

    http://m.welltrend.com.cn/网站在Android手机的qq浏览器或者uc浏览器或者在微信中打开连接访问时,点击右侧的聊天按钮,经常出现手机在北京结果定位到天津的问题,或者广州的 ...

  7. 如何使用 UC浏览器开发者版 进行移动端调试

    在 如何用 fiddler 代理调试本地手机页 一文中我们了解了如何用手机查看 PC 端写的网页(本地),但是我们只能看到页面效果,如果哪段 js 挂了,那部分样式失效了,我们该如何进行调试呢?今天为 ...

  8. 移动端页面调试工具——UC浏览器开发者版

    在移动页面的开发中,我们很难像PC端那样很方便的调试,网上也有各种各样的调试方式.但在工作中,我主要还是用chorme自带的模拟器来模拟各种移动设备,但是用久了之后发现毕竟是模拟的,与真机调试还是会有 ...

  9. 移动端调试 - UC浏览器开发者版 - WIFI

    Chrome  功能特性 支持PC或Pad设备,实时调试手机网页 DOM.CSS.JS调试 多功能面板满足多种调试需求 1   准备工作 保证手机与PC处于同一个无线网段. 下载Android平台的U ...

随机推荐

  1. valueOf()方法

    前面的话 关于类型转换,对象常见的两个方法是toString()和valueOf().实际上,这两个方法也可以应用在包装类型上.前面已经介绍过toString()方法,本文将介绍valueOf()方法 ...

  2. Java多线程系列--“基础篇”10之 线程优先级和守护线程

    概要 本章,会对守护线程和线程优先级进行介绍.涉及到的内容包括:1. 线程优先级的介绍2. 线程优先级的示例3. 守护线程的示例 转载请注明出处:http://www.cnblogs.com/skyw ...

  3. 启动Genymotion时报错Failed to initialize backend EGL display

    在启动Genymotion的时候报错: video card说的是显卡,你的显卡可能不支持  OpenGL2.0,或者你装的驱动有问题. 解决办法:将驱动重新安装一下. 可直接下载一个如“驱动人生“一 ...

  4. 关注经典：CSS Awards 获奖网站作品赏析《第一季》

    每天都有很多新的网站推出,其中不乏一些设计极其优秀的作品.这个系列的文章,我为大家挑选了2012年赢得 CSS Awards 大奖的50个最佳网站.这些鼓舞人心的网站作品代表了网页设计的最高水平,相信 ...

  5. jQuery.Data源码

    jQuery.data的是jQuery的数据缓存系统.它的主要作用就是为普通对象或者DOM元素添加数据. 1 内部存储原理 这个原理很简单,原本要添加在DOM元素本身的数据,现在被集中的存储在cach ...

  6. Javascript动画效果（二）

    Javascript动画效果(二) 在前面的博客中讲了简单的Javascript动画效果,这篇文章主要介绍我在改变之前代码时发现的一些问题及解决方法. 在前面的多物体宽度变化的例子中,我们给其增加代码 ...

  7. 关于IHttpModule的相关知识总结

    一.IHttpModule相关概述 using System; namespace System.Web { public interface IHttpModule { // 销毁不再被HttpMo ...

  8. for of 与 for in的区别

    遍历数组通常使用for循环,ES5的话也可以使用forEach,ES5具有遍历数组功能的还有map.filter.some.every.reduce.reduceRight等,只不过他们的返回结果不一 ...

  9. Visual Studio Code编写HTML

    第一步双击打开Visual Studio Code,我们发现什么也没有,但是有一个默认打开的编辑页面.我们先点击File->OpenFoldor 为什么先这么做呢,有两个原因,第一个原因假如你有 ...

  10. 编写高性能SQL

    前言:系统优化中一个很重要的方面就是SQL语句的优化.对于海量数据,劣质SQL语句和优质SQL语句之间的速度差别可达到上百倍,可见对于一个系统不是简单的能实现其功能就可以了,而是要写出高质量的SQL语 ...