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. apache配置虚拟主机

    步骤如下: 1.在配置文件httpd.conf中启用httpd-vhosts.conf 找到# Virtual hosts将Include conf/extra/httpd-vhosts.conf前的 ...

  2. NPOI导出

    <body> @using (Html.BeginForm("ImportCommentsFile", "CommentsManage", Form ...

  3. iOS 自定义NavigationBar右侧按钮rightBarButtonItem--button

    //两个按钮的父类view UIView *rightButtonView = [[UIView alloc] initWithFrame:CGRectMake(, , , )]; //历史浏览按钮 ...

  4. scrum阶段总结

    项目预期计划: 确定编码规范. 根据原型图,设计并实现UI,添加各个界面,按钮,对话框,列表,窗口,导航等,理清各个界面的跳转逻辑. 学习测试技巧,编写测试用例. 实现需求文档中提出的功能,分别为:景 ...

  5. jQuery总结（2016-7-4）

    1.事件对应有事件的方法, 如click事件, 有click()方法. 2.jQuery动画 3.AJAX是与服务器交换数据的技术! load()方法     get()方法    post()方法

  6. strut2的拦截器之对request和session的封装

    本文主要内容是对  implements Interceptor 这种方式的探索 前提是需要了解:责任链模式 对下面这句代码的理解: Map<String, Object> session ...

  7. Socket,TCP/IP,UDP,HTTP,FTP

    1.Socket:套接字,是传输层协议的一种编程API 作用:用于描述IP地址和端口,区分来自不同应用程序的通信,实现数据传输的并发服务 JDK  Socket:在java.net包下有两个类Sock ...

  8. Java--剑指offer（6）

    26.输入一棵二叉搜索树,将该二叉搜索树转换成一个排序的双向链表.要求不能创建任何新的结点,只能调整树中结点指针的指向. /** public class TreeNode { int val = 0 ...

  9. Linux_日志管理介绍(一)

    一.介绍 1.CentOS 6.x中日志服务已经由rsyslogd取代了原先的syslogd服务,但是rsyslogd是和syslogd服务相兼容的 2.除了系统默认的日志之外,采用RPM方式安装的系 ...

  10. JS 正则表达式中的特殊字符

    正则表达式中的特殊字符 字符 含意 \ 做为转意,即通常在"\"后面的字符不按原来意义解释,如/b/匹配字符"b",当b前面加了反斜杆后/\b/,转意为匹配一个 ...