网页手机wap2.0网页的head里加入下面这条元标签,在移动端的浏览器中页面将以原始大小显示,并不允许缩放。

加入 如下代码 即可自适应移动端的屏幕:

 <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

其中:

         width :控制viewport的大小,可以指定一个值,如600, 或者特殊的值,如device-width为设备的宽度(单位为缩放为100%的CSS的像素)

        height :和width相对应,指定高度 

     initial-scale :初始缩放比例,页面第一次加载时的缩放比例

  maximum-scale :允许用户缩放到的最大比例,范围从0到10.0

   minimum-scale :允许用户缩放到的最小比例,范围从0到10.0

       user-scalable :用户是否可以手动缩放,值可以是:yes/true允许用户缩放;no/false不允许用户缩放

HTML5 Mobile 适应移动端的屏幕<meta name='viewport' content='xxxx'>的更多相关文章

  1. h5 移动端开发自适应 meta name="viewport"的使用总结

    本文系个人理解,可能有误差,仅供参考,谨慎采纳! 布局视口: 系统自带 一般大于屏幕宽度 理想宽度:  设置页面的viewport 的一个宽度,使不同的手机的布局视口宽度尽量接近可视窗口的值: 可视视 ...

  2. 移动端网页开发 meta 之 viewport

    这几天在搞微信公众平台,涉及到几个页面要写,可是当我测试时发现和想象中不太一样,于是去找了几个页面看了下,发现他们页面头部有 meta viewport 的标签,所以去找了下网上的资料,发现千篇一律, ...

  3. <meta name="viewport" content="width=device-width, initial-scale=1.0">的说明

    今天在做适配手机版时,chrome调到手机版,但是还是显示PC端的样式,无法展现出手机端的样式: 开始的时候还以为是chrome版本的问题,最新版本的chrome62.0是有很多变化的,而之前工作中使 ...

  4. <meta name="viewport" content="width=device-width, initial-scale=1.0">理解

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

  5. 关于 <meta name="viewport" content="width=device-width, initial-scale=1.0">的解释

    对于移动开发来讲,我还不太熟悉.今天在github上荡了一个系统源码,进行分析.发现其中有这样一段话: <meta name="viewport" content=" ...

  6. 论meta name= viewport content= width=device-width initial-scale=1 minimum-scale=1 maximum-scale=1的作用

    一.先明白几个概念 phys.width: device-width: 一般我们所指的宽度width即为phys.width,而device-width又称为css-width. 其中我们可以获取ph ...

  7. <meta name="viewport" content="width=device-width, initial-scale=1" />

    今天第一次用JQuery Mobile做了个3个手机小页面,一个登陆页面.一个列表页面和一个表单页面,页面中的组件呈现一切正常. 但出现了一个奇怪的问题,登陆页面大小正常,到了列表页面和表单页面就显得 ...

  8. [HTML] <meta name="viewport" content="width=device-width,initial-scale=1.0">释义

    <meta name="viewport" content="width=device-width,initial-scale=1.0">这是 HT ...

  9. <meta name="viewport"content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">的作用

    本人对该标签理解不深,这里是复制了穆乙的文章:如果有人进来看到这篇文章,请按此https://www.cnblogs.com/pigtail/archive/2013/03/15/2961631.ht ...

随机推荐

  1. mysql创建存储过程

    -- 创建CREATE PROCEDURE proDelAccountById(IN in_accountid int) BEGIN -- 执行sql预计 END -- 调用 ; CALL proDe ...

  2. 基于C#—WPF的扫雷游戏

    自学教材:<C#入门经典(第六版)>,1月28日购入,1月29日到2月9日学习了前十六章,由于有C语言基础,在语法阶段学习起来比较轻松,不过在接触到面向对象的时候遇到了一些困难,对于一些概 ...

  3. 数据挖掘(data mining),机器学习(machine learning),和人工智能(AI)的区别是什么? 数据科学(data science)和商业分析(business analytics)之间有什么关系?

    本来我以为不需要解释这个问题的,到底数据挖掘(data mining),机器学习(machine learning),和人工智能(AI)有什么区别,但是前几天因为有个学弟问我,我想了想发现我竟然也回答 ...

  4. HTML骨架-深入理解

    HTML是WEB开发最基本的语言之一,也是最重要的语言之一,我们在浏览网页时做看到的内容是最直接的呈现形式就是HTML代码.<!DOCTYPE html PUBLIC "-//W3C/ ...

  5. 从一道面试题谈linux下fork的运行机制

    http://www.cnblogs.com/leoo2sk/archive/2009/12/11/talk-about-fork-in-linux.html

  6. Qt 自定义事件详细实例(继承QEvent,然后QCoreApplication::postEvent()、sendEvent())

    创建用户事件 创建一个自定义类型的事件,首先需要有一个事件号,其值通常大于QEvent::User.为了传递事件信息,因此必须编写自定义的事件类,该事件类从QEvent继承. 编写用户事件:编写用户事 ...

  7. jQuery之位置

    1.offset()获取匹配元素在相对浏览器窗口的偏移量 返回一个对象,包括两个属性.left:相对浏览器窗口左边的距离.top:相对浏览器顶部的距离.  $("#div1").o ...

  8. java.net.SocketTimeoutException: Read timed out

    If you get java.net.SocketTimeoutException: Read timed out exception Try setting own timeout value w ...

  9. logstash nginx 访问日志

    log_format main '$remote_addr [$time_local] "$request" ' '$request_body $status $body_byte ...

  10. poj 2299 Ultra-QuickSort(归并排序或是bit 树+离散化皆可)

    题意:给一个数组,计算需要的冒泡排序的次数,元素个数很大,不能用n^2的冒泡排序计算. 解析:这题实际上就是求逆序对的个数,可以用归并排序的方法,我这里用另一种方法写,bit树+离散化.由于元素的值可 ...