1、WebApp全屏模式:

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

注意:viewport 后面加上 minimal-ui 在safri 体现效果

<meta name="apple-mobile-web-app-capable" content="yes" />

2、隐藏状态栏/设置状态栏颜色

<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />

3、safri 添加到主屏界面的显示标题

<meta name="apple-mobile-web-app-title" content="应用标题">

4、忽略自动识别数字为电话号码

<meta content="telephone=no" name="format-detection" />

5、忽略自动识别邮箱账号

<meta content="email=no" name="format-detection" />

6、常用浏览器全屏设置

<!-- uc强制竖屏 -->
<meta name="screen-orientation" content="portrait"> <!-- UC强制全屏 -->
<meta name="full-screen" content="yes"> <!-- UC应用模式 -->
<meta name="browsermode" content="application"> <!-- QQ强制竖屏 -->
<meta name="x5-orientation" content="portrait"> <!-- QQ强制全屏 -->
<meta name="x5-fullscreen" content="true"> <!-- QQ应用模式 -->
<meta name="x5-page-mode" content="app">

<!-- 是针对一些老的不识别viewport的浏览器,列如黑莓 -->

<meta name="HandheldFriendly" content="true">
<!-- 微软的老式浏览器 -->

<meta name="MobileOptimized" content="320">

移动开发webapp开发常用meta设置手机浏览器全屏模式的更多相关文章

  1. 移动开发常用meta设置

    <!-- 视图窗口,移动端特属的标签. --> <meta name="viewport" content="width=device-width,in ...

  2. meta设置与去除默认样式--移动端开发整理笔记(一)

    视口设置: <meta name="viewport" content="width=device-width,user-scalable=no,initial-s ...

  3. 用PC浏览器模拟手机浏览器(一):无扩展版

    想浏览手机版,打开对应网址却跳转到PC版?怎么办? 下面咱们来说下在只是安装了浏览器,无需其他安装操作的情况下来怎么用PC浏览器模拟手机浏览器,然后访问手机站点. 浏览器众多,IE系列的咱就不考虑了, ...

  4. WEBAPP开发技巧(手机网站开发注意事项)

    以下只是我个人得总结,如果你有更好的建议,请留言,一起共勉进步!!- -! 1.要响应式开发web,也就是页面必须自适应屏幕大小,可以采用流体布局,如之前的文章(自适应宽度布局),其他具体的小问题可以 ...

  5. 一步一步构建手机WebApp开发——页面布局篇

    继上一篇:一步一步构建手机WebApp开发——环境搭建篇过后,我相信很多朋友都想看看实战案例,这一次的教程是页面布局篇,先上图: 如上图所示,此篇教程便是教初学者如何快速布局这样的页面.废话少说,直接 ...

  6. 一步一步构建手机WebApp开发——环境搭建篇

    从2007年,乔布斯带来了第一代Iphone手机,整个移动互联网发生天翻地覆的变化,也同时证明了乔布斯的一句名言:“再一次改变世界”. 在当今的移动互联网,手机App居多,很多App对移动设备的要求也 ...

  7. vue 开发webapp 手机返回键 退出问题

    vue 开发webapp 手机返回键 退出问题 mui进行手机物理键的监听 首先安装 vue-awesome-mui npm i vue-awesome-mui 在main.js注册 在index.h ...

  8. 移动端网站开发要点-meta设置

    <!DOCTYPE html> <!-- 使用 HTML5 doctype,不区分大小写 --> <html lang="zh-cmn-Hans"&g ...

  9. webapp开发——‘手机屏幕分辨率’与‘浏览器分辨率’不要混淆

    关于webApp响应式设计遇到的问题,分享给大家,最近在做一个手机webApp,因为我手机是”米3“,屏幕截图大小是1080宽,所以css样式用@media screen and(min-width: ...

随机推荐

  1. 复杂sql分组查询 ( pivot)

    一个数据表里面字段有年.月.日.金额.支付方式等字段,然后现在想写个sql语句,把每一天的每种支付方式金额(支付方式有多重)排在同一行, 最后在增加一列小计当前的所有支付方式的金额.如下图: 原sql ...

  2. NSArray与NSMutableArray 数组与可变数组

    1.NSArray 是一个父类,NSMUtableArray是其子类,他们构成了OC的数组.2.NSArray的创建NSArray * array = [[NSArray alloc]initWith ...

  3. 多线程(pthread、NSThread、GCD)

    pthread C语言编写 跨平台可移植 线程生命周期需要我们来管理 使用困难 NSThread 面向对象的 可直接操作线程对象 线程生命周期需要我们来管理 使用简单 资源互斥(@synchroniz ...

  4. python 判断学期与学年

    9,10,11,12,1 第一学期 2,3,4,5,6,7 第二学期 其中8月份放假,暂且放入第一学期.因为大部分学校都选在8月底开学 import datetime def getXNandXQ() ...

  5. linux下 yum 安装mysql和卸载

    1.查看有没有安装过: yum list installed mysql* rpm -qa | grep mysql* 2.查看有没有安装包: yum list mysql* 3.安装mysql客户端 ...

  6. Sql与MySQL简单入门

    作为过来人,给"新司机"一点建议:运维时需要搭建的生产环境,需尽量保持与测试环境一致:但搭建环境时,又苦于找不到合适的版本怎么办?不用怕,我是一个体贴的人,管杀也管埋(该链接为My ...

  7. WebService的介绍概念 收藏

    WebService学习总结(二)——WebService相关概念介绍 一.WebService是什么? 1. 基于Web的服务:服务器端整出一些资源让客户端应用访问(获取数据) 2. 一个跨语言.跨 ...

  8. Tomcat:bio nio 的设计

    BIO  由Acceptor接收Socket,将其转交给Worker来处理. NIO 由Acceptor接收Socket,将其转交给Poller来轮询处理.Poller再将可处理的Socket交给Wo ...

  9. 深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点

    深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点 2011-12-28 23:00 by 汤姆大叔, 139489 阅读, 119 评论, 收藏, 编辑 才华横溢的 ...

  10. java -jar 执行 eclipse export 的 jar 包报错处理

    1. 错误1:打 jar 包执行,报错,找不到 类库的 jar 包 F:\>java -jar remoteLogin.jarException in thread "AWT-Even ...