android fixed

场景:解决position:fixed;在android webkit 不起作用的有关问题

解决position:fixed;在android webkit 不起作用的问题

解决position:fixed;在android webkit 不起作用的问题:

 

加入如下标记

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

 

 

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