html隐藏浏览器菜单栏,移动设备(手机)上浏览器全屏隐藏工具栏和菜单栏的设置...

让手机上易于浏览阅读，meta viewport 必不可少。作为一款 webApp，你可能更希望默认为全屏模式。通过 meta 配置，在某些浏览器版本上可以实现这种效果。

以下内容仅供参考。

meta viewport 写法与相关参数

meta viewport 写法与相关参数如下。

width viewport 宽度(数值<200-10000>/device-width)

height viewport 高度(数值<233-10000>/device-height)

initial-scale 初始缩放比例(0-10)

maximum-scale 允许用户最大缩放比例

minimum-scale 允许用户最小缩放比例

user-scalable 是否允许用户缩放(yes/no)

minimal-ui iOS 7.1 beta 2 中新增属性，可以在页面加载时最小化上下状态栏。这是一个布尔值。但该参数在 IOS 8 后被移除了。

Name

Value

Description

width

正整数或device-width

定义视口的宽度，单位为像素

height

正整数或device-height

定义视口的高度，单位为像素

initial-scale

[0.0-10.0]

定义初始缩放值

minimum-scale

[0.0-10.0]

定义缩小最小比例，它必须小于或等于maximum-scale设置

maximum-scale

[0.0-10.0]

定义放大最大比例，它必须大于或等于minimum-scale设置

user-scalable

yes/no

定义是否允许用户手动缩放页面，默认值yes

移动设备上浏览器全屏/应用模式

如果希望你的站点/webApp 在手机上展示为全屏模式，下面一些参数可以参考。

1、Safari 7.x 全屏模式(minimal-ui)：

删除默认的苹果工具栏和菜单栏

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

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

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

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

6、常用浏览器全屏设置：

设置示例参考