viewport Meta Tag

时间 2019-11-17

标签 viewport meta tag 栏目 HTML5 繁體版

原文原文链接

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

viewport Meta 标记浏览器

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

在<head>中，写下如下代码it

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

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

width
视口的宽度。能够使用像素值，但推荐使用device-width关键字。表示依照设备屏幕的宽度。移动

heightview

视口的高度。不用指定。vi

user-scalable标签

用户是否能够缩放视口。
值能够是：
1, yes, or true: 容许用户缩放
0, no, or false: 不准用户缩放

initial-scale

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

minimum-scale

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

maximum-scale

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