viewport

<meta name="viewport" content="" />
     width [pixel_value | device-width] width 直接去设置具体数值大部分的安卓手机不支持的 但是IOS支持
     user-scalable 是否允许缩放 (no||yes)    
     initial-scale 初始比例
     minimum-scale 允许缩放的最小比例
     maximum-scale 允许缩放的最大比例
     target-densitydpi
     -- dpi_value 70–400 //每英寸像素点的个数
     -- device-dpi 设备默认像素密度
     -- high-dpi 高像素密度    
     -- medium-dpi 中等像素密度
     -- low-dpi 低像素密度
     -- webkit内核已不准备再支持

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

时间: 2024-08-08 07:20:43

viewport的相关文章

移动端布局(viewport)方法

viewport默认有6个属性 width: 设置viewport的宽度(即之前所提及到的,浏览器的宽度详),这里可以为一个整数,又或者是字符串"width-device" initial-scale: 页面初始的缩放值,为数字,可以是小数 minimum-scale: 允许用户的最小缩放值,为数字,可以是小数 maximum-scale: 允许用户的最大缩放值,为数字,可以是小数 height: 设置viewport的高度(我们一般而言并不能用到) user-scalable: 是否

ExtJs布局之viewport

<!DOCTYPE html> <html> <head> <title>ExtJs</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <link rel="stylesheet" type="text/css" href="ExtJs/

移动前端开发之viewport的深入理解

在移动设备上进行网页的重构或开发,首先得搞明白的就是移动设备上的viewport了,只有明白了viewport的概念以及弄清楚了跟viewport有关的meta标签的使用,才能更好地让我们的网页适配或响应各种不同分辨率的移动设备. 一.viewport的概念 通俗的讲,移动设备上的viewport就是设备的屏幕上能用来显示我们的网页的那一块区域,在具体一点,就是浏览器上(也可能是一个app中的webview)用来显示网页的那部分区域,但viewport又不局限于浏览器可视区域的大小,它可能比浏览

移动web 的viewport设置注意事项的详细解释 六一快乐=-_-_

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <!--对viewport的设置的meta建议写在已有的meta标签(<meta charset="UTF-8">)之后--> <!--name="viewport":说明当前meta标签是用来设置viewport的属性的,

viewport简介

Viewport的用处:手机拥有了浏览器的初期,人们并没有专门为移动设备设计页面,造成的直接结果就是,访问的页面是直接将电脑页面进行缩放,操作起来有诸多不便,viewport就是用来解决这个问题的 1.viewport的概念:移动设备上,用来显示网页的区域. 如果把移动设备的浏览器(也有可能是app中的webview) ,当做相框的话 viewport就相当于相框中的画,可能会比相框小,可能会比相框大,如果刚好一样大,那就皆大欢喜. 2.修改viewport:我们可以通过meta标签去修改vie

手机端的viewport属性

Window.devicePixelRatioThis read-only property returns the ratio of the resolution in physical pixels to the resolution in CSS pixels for the current display device. 该值为分辨率之间的比,不是直接比较像素.分辨率是指单位英寸内像素数,类似于PPI.pc端浏览器中dpr的值都为1,所以css中1px的元素在屏幕中占据1物理像素.但在手

meta name=&quot;viewport&quot; content=&quot;width=device-width,initial-scale=1.0&quot; 解释

meta name="viewport" content="width=device-width,initial-scale=1.0" 解释 <meta name="viewport" content="width=device-width,initial-scale=1.0"> content属性值 : width:可视区域的宽度,值可为数字或关键词device-width height:同width intia

移动端Viewport &amp; 使用rem来开发移动端网站

Viewport大神 无双 的精彩解释 具体参数各型号是否支持参见: http://www.cnblogs.com/2050/p/3877280.html#commentform 摘录: 移动设备上的viewport: 设备的屏幕上能用来显示我们的网页的那一块区域 设备像素比: docment.devicePixelRatio = 物理像素 / 独立像素 在Retina屏的iphone上,devicePixelRatio的值为2,也就是说1个css像素相当于2个物理像素. 一些设备上浏览器的默认

html - &lt;meta name=&quot;viewport&quot; content=&quot;XX&quot;/&gt; 标签常见属性及说明

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" /> 在网页的<head>中增加以上这句话,可以让网页的宽度自动适应手机屏幕的宽度. 其中: width=device-width :表示宽度是设备屏幕的宽度 height=device-he