典型代码

<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 一起使用。这样禁用缩放功能后,用户只能滚动屏幕,就能让您的网站看上去更像原生应用的感觉。

关于 viewport meta的更多相关文章

  1. [转载]ViewPort <meta>标记

    ViewPort <meta>标记用于指定用户是否可以缩放Web页面,如果可以,那么缩放到的最大和最小缩放比例是什么.使用 ViewPort <meta>标记还表示文档针对移动 ...

  2. [转]手机web HTML头信息解释和viewport meta标签解释

    <meta charset="utf-8" /> <link rel="shortcut icon" href="favicon.i ...

  3. ViewPort <meta>标记

    ViewPort <meta>标记用于指定用户是否可以缩放Web页面,如果可以,那么缩放到的最大和最小缩放比例是什么.使用ViewPort <meta>标记还表示文档针对移动设 ...

  4. viewport Meta Tag

    网页手机wap2.0网页的head里加入下面这条元标签,在iPhone的浏览器中页面将以原始大小显示,并不允许缩放. <meta name="viewport" conten ...

  5. 什么是Viewport Meta(width详解)及在手机上的应用

    viewport是专为手机浏览器设计的一个meta标签: 有些屏幕很小有智能手机,但分辩率却可以做得很大,比如小米4的默认分辨率为:1920*1080,比许多电脑桌面的都还大,传统桌面网站直接放到手机 ...

  6. HTML5 Viewport Meta Tag

    https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/U ...

  7. Using the viewport meta tag to control layout on mobile browsers

    A typical mobile-optimized site contains something like the following: <meta name="viewport& ...

  8. Meta标签中的viewport属性及含义

    一.什么是Viewport 手机浏览器是把页面放在一个虚拟的"窗口"(viewport)中,通常这个虚拟的"窗口"(viewport)比屏幕宽,这样就不用把每个 ...

  9. HTML meta viewport属性详细说明

    viewport并非只是ios上的独有属性,在android.winphone上同样也有viewport,下面为大家详细介绍下HTML meta viewport 什么是Viewport 手机浏览器是 ...

随机推荐

  1. 分享5个主流的HTML5开发工具

    HTML5被看做是web开发者创建流行web应用的利器,增加了对视频和Canvas 2D的支持.用HTML5的优点主要在于,这个技术可以进行跨平台的使用.比如你开发了一款HTML5的游戏,你可以很轻易 ...

  2. error LNK1104: 无法打开文件“libboost_thread-vc140-mt-gd-1_61.lib”

    error LNK1104: 无法打开文件“libboost_thread-vc140-mt-gd-1_61.lib” 调试->你的项目属性 配置属性->VC++目录 包含目录 D:\bo ...

  3. 创建渐进式jpeg图片

    <?php // Create an image instance $im = imagecreatefromjpeg('test.jpg');   // Enable interlancing ...

  4. C#—Dev XtraTabControl动态增加Tab和关闭选项卡方法

    C#—Dev XtraTabControl动态增加Tab和关闭选项卡方法,有需要的朋友可以参考下. 记录一下以免以后忘了 添加using DevExpress.XtraTab; 双击listview增 ...

  5. ORACLE Recyclebin管理及flashback recyclebin中的对象

    Flashback用于恢复用户误删除的对象(包括表,索引等), 不支持sys用户. system表空间下的对象,也不能从回收站里拿到.故使用SYS 或者SYSTEM用户登陆时, show recycl ...

  6. Java基础笔记-String类2

    StringBuffer 特点: 是字符串缓冲区. 是一个容器,其长度可变,可以操作添加多个数据类型. 最后通过toString方法变成字符串. 被final锁修饰,因此不能被继承. 存储: 方法1: ...

  7. css 的z-index研究

    z-index的值受position影响,而且还受父级元素影响.有很多种情况.下面是我看的一个特别全的网址,讲的很详细,收藏了,以后温故用. 对应的例子页面:http://www.neoease.co ...

  8. android的color整理(一)

    很全面的颜色收集方便以后使用. <!-- 白色 --> <color name="ivory">#fffff0</color> <!-- ...

  9. MVC 5 + EF 6

    (一) ??运算符 C#中两个问号(“?”)的作用是判断“?”左边的对象是否为null,如果不为null则使用“?”左边的对象,如果为null则使用“?”右边的对象. (二)VS安装Entity Fr ...

  10. 在一个RAC集群中最多支持多少节点

    How many nodes can one have in an HP-UX/Solaris/AIX/Windows/Linux cluster? Technically and since Ora ...