zoukankan      html  css  js  c++  java
  • viewport Meta Tag

    1. 网页手机wap2.0网页的head里加入下面这条元标签,在iPhone的浏览器中页面将以原始大小显示,并不允许缩放。
    2. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    3. width - viewport的宽度 height - viewport的高度
    4. initial-scale - 初始的缩放比例
    5. minimum-scale - 允许用户缩放到的最小比例
    6. maximum-scale - 允许用户缩放到的最大比例
    7. user-scalable - 用户是否可以手动缩放

     

    viewport Meta 标记

    今天来说说viewport Meta标记。这个标记最开始是由苹果引进的,用来标记移动设备的浏览器的视口大小。现在,这个标记也已经被Android接受。不止如此,除了WebKit内核的浏览器,Mozilla也接受了这个标记。据说,HTML5也将正式引入这个标记。

    在<head>中,写下以下代码

    <meta name="viewport" content="width=device-width; user-scalable=0;" />
    就可以让您的网页适应移动浏览器的大小。

    视口,和ps中的画布比较相像。

    下面解释一下viewport的meta标记中各个参数的具体意义。

    width
    视口的宽度。可以使用像素值,但推荐使用device-width关键字。表示依照设备屏幕的宽度。

    height

    视口的高度。不用指定。

    user-scalable

    用户是否可以缩放视口。
    值可以是:
    1, yes, or true: 允许用户缩放
    0, no, or false: 不许用户缩放


    initial-scale

    初始缩放值。比如1.0表示一个视口像素等于一个屏幕像素。


    minimum-scale

    最小比例值。范围从0至10.0

    maximum-scale

    最大比例值。范围从0至10.0

  • 相关阅读:
    Android外部SD卡的读取
    TableLayout(表格布局)
    Android中Adapter之BaseAdapter使用
    Android中Spinner下拉列表(使用ArrayAdapter和自定义Adapter实现) .
    html5新增及废除属性
    Android Studio运行程序出现Session ‘app’: Error Launching activity 解决办法
    Android的面孔_Actiyity
    初步理解类和对象
    zabbix(2)使用指南
    zabbix(1)基础知识
  • 原文地址:https://www.cnblogs.com/suizhikuo/p/3439507.html
Copyright © 2011-2022 走看看