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

程序员文章站 2022-04-12 22:32:01

...

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

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

复制代码

代码如下:

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

复制代码

代码如下:

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

复制代码

代码如下:

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

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

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

声明：本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn核实处理。