由于在iPhonex在状态栏增加了24px的高度，对于通栏banner规范的内容区域会有遮挡情况。 解决方案：在页面通栏banner顶部增加一层高度44px的黑色适配层，整个页面往下挪44px，这种做法虽然不符合苹果设计规范，可以先以这种方式处理，后续再优化banner设计展现。 对于底部 ...

在页面加入一行css代码即可 然后在需要适配的元素上使用footer类即可 ...

方案： 固定一个某些宽度，使用一个模式，加上少许的媒体查询方案 使用flexbox解决方案 使用百分比加媒体查询 使用rem 1. 简单问题简单解决 我觉得有些web app并一定很复杂，比如拉勾网，你看看它的页面在iphone4,iphone6,ipad下的样子 ...

一：本文提供两种解决方案 1.终端解决方案（最优，建议选择） 2.web解决方案 导语: iPhone X的出现，一方面对于整个手机行业的发展极具创新领头羊的作用，另一方面也对现有业务的页面适配带来了新的挑战。 对于手Q中的各业务来说，受iPhone X影响的H5页面挺多，应该采取 ...

前两天，美团推出的杨洋H5火爆朋友圈。里面主要的是多段视频播放、暂停。听起来很简单，但是由于腾讯白名单限制，在微信浏览器，qq浏览器，会自动将video标签中非腾讯域名的视频 ，自动全屏，结尾追加视频推荐。并且白名单申请入口已经关闭。 本文包含 全屏适配播放 并在 ...

H5 页面唤起APP或跳转到下载APP的某个链接地址。总结如下： 在 IOS 中， 系统版本在 8 以下时，可以监听页面的 pagehide / visibilitychange 事件。 系统版本大于 8 以后，可以使用 universal Link 或 URL scheme 进行跳转。 ...

传统的精灵动画： 磁盘空间大，下载慢，尤其是在线播放，会更慢文件太多，在线播放的时候，太多http请求，会导致响应慢，或者行为失常因此，急需开发了一套技术，用视频代替精灵动画。我们称这种视频叫做交互 ...

前面有分享了4种适配方案，但始终是通过手动缩放或者视口缩放来实现，用来做一些专题页，或者功能相对简单的项目来说也是完全能应付的，但整体来说感觉还是一种缩放，说不上是真正的适配，言外之意就是即将分享真正的适配喽，呵呵，开个玩笑，其实适配方式千差万种，怎么用全靠自己把握，遇到问题总有解决 ...