一、 媒体查询、

@media screen and (device-width:375px) and (device-height:812px){
#header {
height: 88px;
padding-top: 44px !important;
}
.mui-content {
padding-top: 88px !important;
}
}

二、iOS11 新增特性,苹果公司为了适配 iPhoneX 对现有 viewport meta 标签的一个扩展,用于设置网页在可视窗口的布局方式,

<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">

三、测试中发现如果页面内容不够多的时候。底部会有白色的间距,测试为44px,这需要设置页面的高度加44,应该是ios11的bug。

$(".mui-content").css("height",(window.innerHeight+44)+"px");

关于H5移动端开发 iPhone X适配的更多相关文章

  1. h5移动端flexible源码适配终端解读以及常用sass函数

    ;(function(win, lib) { var doc = win.document;// win = window,lib = window.lib; var docEl = doc.docu ...

  2. H5移动端开发入门知识以及CSS的单位汇总与用法

    说到css的单位,大家应该首先想到的是px,也就是像素,我们在网页布局中一般都是用px,但是近年来自适应网页布局越来越多,em和百分比也经常用到了.然后随着手机的流行,web app和hybrid a ...

  3. H5 移动端开发中 ios/安卓坑 和经验总结

    1. ios new时间对象,需要用逗号隔开传日期的方式, 不支持 new Date('2019-03-01 08:00:00') 格式: 支持以下两种方式: 2. ios个别版本对fixed的属性的 ...

  4. h5 移动端开发自适应 meta name="viewport"的使用总结

    本文系个人理解,可能有误差,仅供参考,谨慎采纳! 布局视口: 系统自带 一般大于屏幕宽度 理想宽度:  设置页面的viewport 的一个宽度,使不同的手机的布局视口宽度尽量接近可视窗口的值: 可视视 ...

  5. H5移动端开发vue+vux

    项目src中用到的npm包有(从编译打包到最终部署仍不能移除)1:vue             渐进式 JavaScript 框架   http://cn.vuejs.org/v2/guide/2: ...

  6. H5移动端开发

    开发前准备 环境: Node.js LTS版本 git 最新版 文档: 本项目技术栈基于 ES2016 VueJS vux 快速开始 1.克隆项目 git clone https://gitee.co ...

  7. H5移动端开发遇见的东西

    常见的有viewport.强制浏览器全屏.IOS的Web APP模式.可点击元素出现阴影 本文主要讲一些其他的或者实用的优化手段. 1. 弹出数字键盘 <!-- 有"#" & ...

  8. 整理几个经常在H5移动端开发遇到的东西。

    本篇主要是我个人的学习分享. 1.弹出数字键盘 <!-- 有“#” “*” 符号输入 --> <input type="tel"> <!-- 纯数字 ...

  9. 超详细讲解H5移动端适配

    前言 移动互联网发展至今,各种移动设备应运而生,但它们的物理分辨率可以说是五花八门,一般情况UI会为我们提供375尺寸的设计稿,所以为了让H5页面能够在这些不同的设备上尽量表现的一致,前端工程师就不得 ...

随机推荐

  1. luogu P1714 切蛋糕 单调队列

    单调队列傻题. 考虑以 $i$ 结尾的答案 : $max(sumv_{i}-sumv_{j}),j \in [i-m,i-1]$ ($sumv_{i}$ 为前缀和) 稍微搞一搞,发现 $sumv_{i ...

  2. Crossing Rivers UVA - 12230 概率与期望

    题目大意:有个人每天要去公司上班,每次会经过N条河,家和公司的距离为D,默认在陆地的速度为1,给出N条河的信息,包括起始坐标p,宽度L,以及船的速度v.船会往返在河的两岸,人到达河岸时,船的位置是随机 ...

  3. eas之f7

    f7控件实际上是一张单据.所以对于数据的修改实际上是需要修改单据的,是在eas中修改单据的元数据是组件.包括了f7控件,    F7是个快捷键,是某个字段符合条件的集合!    F7就是一个控件,用来 ...

  4. 15.6.1 【Task使用】基于任务的异步模式

    C# 5异步函数特性的一大好处是,它为异步提供了一致的方案.但如果在命名异步方法以及 触发异常等方面做法存在着差异,则很容易破坏这种一致性.微软因此发布了基于任务的异步模 式(Task-based A ...

  5. rsync增量同步标志位详细解释

    rsync非常强大,下面是我用rsync做目录备份时用到的参数: rsync -ruPi -plEt /home/op/photo/ /remote_backup/photo/ --dry-run - ...

  6. 16._source元数据

  7. Golang - 流程控制

    目录 Golang - 流程控制 1. 选择结构 2. 循环结构 3. 跳转语句 Golang - 流程控制 1. 选择结构 if else语句: //package 声明开头表示代码所属包 pack ...

  8. Git 基础教程 之 Bug分支和Stash

    在Git中,每个Bug都可以通过一个新的临时分支修复,修复后,合并分支,然后删除. ①    当接到一个Bug任务时,但dev上进行的工作还没有提交时: ②    git stash 把现场工作“储藏 ...

  9. Java基础学习总结(67)——Java接口API中使用数组的缺陷

    如果你发现在一个接口使用有如下定义方法: public String[] getParameters(); 那么你应该认真反思.数组不仅仅老式,而且我们有合理的理由避免暴露它们.在这篇文章中,我将试图 ...

  10. SIM300命令参考

    开机命令   AT+CFUN=1,1          //此命令可以开启simcom模块的大部分功能,一般在初始化模块的时候都要写上: AT&F                        ...