利用meta标签禁止用户缩放

<meta name="viewport" content="width=device-width, initial-scale=1.0">

width 属性控制设备的宽度。假设您的网站将被带有不同屏幕分辨率的设备浏览,那么将它设置为 device-width 可以确保它能正确呈现在不同设备上。
initial-scale=1.0 确保网页加载时,以 1:1 的比例呈现,不会有任何的缩放。
在移动设备浏览器上,通过为 viewport meta 标签添加 user-scalable=no 可以禁用其缩放(zooming)功能。
通常情况下,maximum-scale=1.0 与 user-scalable=no 一起使用。这样禁用缩放功能后,用户只能滚动屏幕,就能让您的网站看上去更像原生应用的感觉。
注意,这种方式我们并不推荐所有网站使用,还是要看自己的情况而定!

<meta name="viewport" content="width=device-width, 
                                     initial-scale=1.0, 
                                     maximum-scale=1.0, 
                                     user-scalable=no">
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,382评论 1 45
  • < meta > 元素 概要 标签提供关于HTML文档的元数据。元数据不会显示在页面上,但是对于机器是可读的。它可...
    种谔阅读 3,483评论 2 2
  • < meta > 元素概要标签提供关于HTML文档的元数据。元数据不会显示在页面上,但是对于机器是可读的。它可用于...
    TeslaChen阅读 4,615评论 0 1
  • 有效的学习方法 一、心态良好 1.1 梦想激励法——激发学习的热情 有梦想,才会有学习的动力。如果缺乏自我激励,学...
    vveinv阅读 5,355评论 0 1
  • 6.1前夕,收到老师发来的私信。 幼儿园获奖,你说我这是越活越年轻了?还是吹牛吹大发了?。。。 于是,我苦命的假期...
    S猫阅读 3,199评论 0 6

友情链接更多精彩内容