viewprot屏幕尺寸,专为移动页面设计

参数

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

width,height

宽高,或者device-width、device-height设备的宽高

initial-scale

初始缩放比例。如果设2.0则会放大两倍

maximum-scale

允许用户缩放最大比例

minumum-scale

允许用户缩放最小比例

usex-scalable

是否可以手动缩放,yes or no

缩放值必须在 0.1 - 10 之间

target-densitydpi

屏幕像素密度由分辨率决定,通常定义为dpi,取值范围如下

device-dpi:使用设备原本的dpi作为目标dpi,不会发生默认缩放

high-dpi:中等像素密度和低像素密度设备相应缩小

medium-dpi:高像素密度设备相应放大,像素密度设备相应缩小。默认

low-dpi:中等像素密度和高像素密度设备相应放大

value:取值范围 70 - 400


<meta name="viewport" content="width=640,user-scalable=no,target-densitydpi=device-dpi">

将宽度设为640,因为目前主流 的设备宽度为640,样式上不用特殊处理,与PC书写保持一致。

Viewprot meta学习笔记的更多相关文章

  1. 淘宝网触屏版 - 学习笔记(1 - 关于meta)

    注:本文是学习笔记,并不是教程,所以会有很多我不理解或猜测的问题,也会有不尽详实之处,望见谅. <meta charset="utf-8"> <meta cont ...

  2. js学习笔记:webpack基础入门(一)

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

  3. seaJs学习笔记2 – seaJs组建库的使用

    原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ...

  4. HTML学习笔记

    HTML学习笔记 2016年12月15日整理 Chapter1 URL(scheme://host.domain:port/path/filename) scheme: 定义因特网服务的类型,常见的为 ...

  5. bootstrap学习笔记--bootstrap安装环境

    Bootstrap 安装是非常容易的.此文是本人的学习汇总,便于以后查询学习,同时也希望给大家带来帮助. 下载 Bootstrap 您可以从 http://getbootstrap.com/ 上下载 ...

  6. Vue.js学习笔记(2)vue-router

    vue中vue-router的使用:

  7. CSS3与页面布局学习笔记(八)——浏览器兼容性问题与前端性能优化方案

    一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...

  8. 【前端】移动端Web开发学习笔记【2】 & flex布局

    上一篇:移动端Web开发学习笔记[1] meta标签 width设置的是layout viewport 的宽度 initial-scale=1.0 自带 width=device-width 最佳实践 ...

  9. 淘宝网触屏版 - 学习笔记(0 - 关于dpr)

    注:本文是学习笔记,并不是教程,所以会有很多我不理解或猜测的问题,也会有不尽详实之处,望见谅. 对于pc端网页设计师来说,移动端的网页制作,我之前只是简单的加了一个 <meta name=&qu ...

随机推荐

  1. 分析cocos2d-x中的CrystalCraze示例游戏

    cocos2d-x自带了不少示例,以及几个比较简单的游戏,不过这些游戏都是用javascript binding(SpiderMonkey)做的,所以我猜测javascript binding可能是c ...

  2. DTCMS插件的制作实例电子资源管理(一)插件目录结构

    总目录 插件目录结构(一) Admin后台页面编写(二) 前台模板页编写(三) URL重写(四)     本实例旨在以一个实际的项目中的例子来介绍如何在dtcms中制作插件,本系列文章非入门教程,部分 ...

  3. web安全——目录

    说明 写这个目录是为了方便阅读.也是为了记录统一的问题. 这个系列,并不一定是全的,也不一定是对的,所以请大家多做过滤. 这里面场景比较多的是本人在实践中遇到的问题,然后自己思考抽象的. 目录 web ...

  4. Bootstrap系列 -- 10. 网格布局

    一. 实现原理 网格布局是通过容器的大小,平均分为12份(可以修改),再调整内外边距,和表格布局有点类似但是也存在区别. 实现步骤如下: (1) 数据行.row 必须包含在容器.container 中 ...

  5. Resharper快捷键

    建议你使用 Reshaper 的快捷键,不要担心 Reshaper 会把你原来的快捷键设置给覆盖了,因为如果某个快捷键和 VS 是冲突的,Reshaper会让你自己选择需要使用 VS 还是 Resha ...

  6. Ubuntu安装出现左上角光标一直闪解决方式

    Ubuntu安装出现左上角光标一直闪解决方式: 01下载ubunu http://cn.ubuntu.com/download/ 02.软碟通 http://pan.baidu.com/s/1qY8O ...

  7. 77 swapon-激活Linux系统中交换空间

    Linux swapon命令用于激活Linux系统中交换空间,Linux系统的内存管理必须使用交换区来建立虚拟内存. 语法 /sbin/swapon -a [-v] /sbin/swapon [-v] ...

  8. grub.conf文件参数详解

    Grub是Linux的下系统启动器之一(另一个名为Lilo),grub.conf相当于 windows下的boot.ini,都是存放启动项设置和信息的,如果你熟悉boot.ini的设置的话相信也可以很 ...

  9. [转]js中的时间与毫秒数互相转换

    原文地址:http://blog.sina.com.cn/s/blog_77cb836301015icr.html [1]js毫秒时间转换成日期时间   var oldTime = (new Date ...

  10. 24 映射-Map

    什么是映射(Map) 映射中的每一个元素包含一个键对象和一个值对象,键不可以重复,值可以重复 key1 value1 key2 value2 key3 value3 key4 value4 key5 ...