编程 HTML / CSS

阻止移动设备(手机、pad)浏览器双击放大网页的方法

Posted in HTML / CSS onJune 03, 2014

现在的手机或平板电脑等移动设备上的浏览器默认都有双击放大的设置，怎么让双击不放大？

在Mobile页面上有提供viewport这个meta，可以用它来设置缩放。但是在使用viewport之前要把页面的文档类型改成Mobile类型。通常的页面DTD都是XHTML或者简单的HTML5声明，移动设备要用下面这个声明。

复制代码

代码如下:

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">

设置了DTD之后就可以使用viewport使页面禁止缩放了。通常把user-scalable设置为0来关闭用户对页面视图缩放的行为。

复制代码

代码如下:

但是为了更好的兼容，我们会使用完整的viewport设置。

复制代码

代码如下:

如果需要更详细的关于viewport的资料可以参考MDN

https://developer.mozilla.org/en-US/docs/Mobile/Viewport_meta_tag

貌似DTD只声明成HTML5就可以了，下面加上viewport的标签

阻止移动设备(手机、pad)浏览器双击放大网页的方法

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

HTML / CSS 相关文章推荐

css3隔行变换色实现示例

Feb 19 HTML / CSS

简单介绍CSS3中Media Query的使用

Jul 07 HTML / CSS

CSS3中颜色线性渐变实战

Jul 18 HTML / CSS

CSS3实现伪类hover离开时平滑过渡效果示例

Aug 10 HTML / CSS

利用CSS3 动画绘画圆形动态时钟

Mar 20 HTML / CSS

让ie浏览器成为支持html5的浏览器的解决方法(使用html5shiv)

Apr 08 HTML / CSS

HTML5 video标签（播放器）学习笔记（一）:使用入门

Apr 24 HTML / CSS

HTML5单页面手势滑屏切换原理分析

Jul 10 HTML / CSS

Html5与App的通讯方式详解

Oct 24 HTML / CSS

CSS 圆形进度栏

Apr 06 HTML / CSS

前端使用svg图片改色实现示例

Jul 23 HTML / CSS

CSS使用SVG实现动态分布的圆环发散路径动画

Dec 24 HTML / CSS

Application Cache未缓存文件无法访问无法加载问题

May 31 #HTML / CSS

HTML5 input placeholder 颜色修改示例

May 30 #HTML / CSS

利用HTML5的新特点实现图片文件异步上传

May 29 #HTML / CSS

HTML5 canvas绘制的玫瑰花效果

May 29 #HTML / CSS

html5设计原理(推荐收藏)

May 17 #HTML / CSS

html5中JavaScript removeChild 删除所有节点

May 16 #HTML / CSS

使用jTopo给Html5 Canva中绘制的元素添加鼠标事件

May 15 #HTML / CSS

You might like

Ajax请求PHP后台接口返回信息的实例代码

2018/08/21 PHP

非常好的js代码

2006/06/27 Javascript

Dojo 学习笔记入门篇 First Dojo Example

2009/11/15 Javascript

javascript检查表单数据是否改变的方法

2013/07/30 Javascript

JavaScript伸缩的菜单简单示例

2013/12/03 Javascript

javascript实时显示当天日期的方法

2015/05/20 Javascript

window.onload绑定多个事件的两种解决方案

2016/05/15 Javascript

使用Bootstrap框架制作查询页面的界面实例代码

2016/05/27 Javascript

第七篇Bootstrap表单布局实例代码详解(三种表单布局)

2016/06/21 Javascript

JavaScript易错知识点整理

2016/12/05 Javascript

微信小程序之拖拽排序（代码分享）

2017/01/21 Javascript

js+html5生成自动排列对话框实例

2017/10/09 Javascript

Angular2.0/4.0 使用Echarts图表的示例代码

2017/12/07 Javascript

layui点击左侧导航栏,实现不刷新整个页面,只刷新局部的方法

2019/09/25 Javascript

微信浏览器下拉黑边解决方案 wScroollFix

2020/01/21 Javascript

[02:55]DOTA2英雄基础教程发条技师

2013/12/04 DOTA

[32:30]夜魇凡尔赛茶话会第一期01：谁是卧底

2021/03/11 DOTA

[08:08]DOTA2-DPC中国联赛2月28日Recap集锦

2021/03/11 DOTA

python基于xmlrpc实现二进制文件传输的方法

2015/06/02 Python

Python中的异常处理相关语句基础学习笔记

2016/07/11 Python

python实现树形打印目录结构

2018/03/29 Python

对python .txt文件读取及数据处理方法总结

2018/04/23 Python

详解python异步编程之asyncio(百万并发)

2018/07/07 Python

python中ASCII码和字符的转换方法

2018/07/09 Python

33个Python爬虫项目实战(推荐)

2019/07/08 Python

python爬虫库scrapy简单使用实例详解

2020/02/10 Python

python 读取.nii格式图像实例

2020/07/01 Python

Collection和Collections的区别

2016/05/02 面试题

什么是动态端口（Dynamic Ports）？动态端口的范围是多少？

2014/12/12 面试题

副乡长民主生活会个人对照检查材料思想汇报

2014/10/01 职场文书

公司领导班子对照检查存在问题整改措施

2014/10/02 职场文书

校园安全主题班会

2015/08/12 职场文书

2016年优秀少先队辅导员事迹材料

2016/02/26 职场文书

Nginx代理同域名前后端分离项目的完整步骤

2021/03/31 Servers

python文本处理的方案(结巴分词并去除符号)

2021/05/26 Python

MySql 缓存查询原理与缓存监控和索引监控介绍

2021/07/02 MySQL