功能:
Viewport可以使我们开发出来的应用或页面大小能适合各种智能手机(Andriod,Iphone,Ipod,WinPhone等)的不同分辨率,不同屏幕大小!
语法及解释:
<meta name="viewport" |
content=" |
height = [pixel_value(指定值px) | device-height(设备高度)] , |
width = [pixel_value(指定值px) | device-width(设备高度) ] , |
initial-scale = float_value (页面初始缩放程度,eg :1.0web页面在展现的时候就会以target density分辨率的1:1来展现,2.0就是放大两倍,值范围0.1~10) , |
minimum-scale = float_value , |
maximum-scale = float_value , |
user-scalable = [yes | no] , |
如果设置为yes则是允许用户对其进行改变,反之为no。
默认值是yes。如果你将其设置为no,那么minimum-scale 和 maximum-scale都将被忽略,因为根本不可能缩放。)
target-densitydpi = [dpi_value(指定dpi值) | device-dpi(使用设备原本的 dpi 作为目标 dp。 不会发生默认缩放) | high-dpi(使用hdpi作为目标 dpi。 中等像素密度和低像素密度设备相应缩小。) | medium-dpi | low-dpi] |
Android支持三种屏幕像素密度:低像素密度(low-dpi),中像素密度(medium-dpi),高像素密度(hdpi)。
一个低像素密度的屏幕每英寸上的像素点更少,而一个高像素密度的屏幕每英寸上的像素点更多。
Android Browser和WebView默认屏幕为中像素密度。
" |
/> |
<meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0, maximum-scale=2.0,
user-scalable=yes,target-densitydpi=device-dpi">
target-densitydpi 设置为 device-dpi。当你这么做了,页面将不会缩放。相反,页面会根据当前屏幕的像素密度进行展示。在这种情形下,你还需要将viewport的width定义为与设备的width匹配,这样你的页面就可以和屏幕相适应。