Viewprot meta学习笔记
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 - 关于meta)
注:本文是学习笔记,并不是教程,所以会有很多我不理解或猜测的问题,也会有不尽详实之处,望见谅. <meta charset="utf-8"> <meta cont ...
- js学习笔记:webpack基础入门(一)
之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...
- seaJs学习笔记2 – seaJs组建库的使用
原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ...
- HTML学习笔记
HTML学习笔记 2016年12月15日整理 Chapter1 URL(scheme://host.domain:port/path/filename) scheme: 定义因特网服务的类型,常见的为 ...
- bootstrap学习笔记--bootstrap安装环境
Bootstrap 安装是非常容易的.此文是本人的学习汇总,便于以后查询学习,同时也希望给大家带来帮助. 下载 Bootstrap 您可以从 http://getbootstrap.com/ 上下载 ...
- Vue.js学习笔记(2)vue-router
vue中vue-router的使用:
- CSS3与页面布局学习笔记(八)——浏览器兼容性问题与前端性能优化方案
一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...
- 【前端】移动端Web开发学习笔记【2】 & flex布局
上一篇:移动端Web开发学习笔记[1] meta标签 width设置的是layout viewport 的宽度 initial-scale=1.0 自带 width=device-width 最佳实践 ...
- 淘宝网触屏版 - 学习笔记(0 - 关于dpr)
注:本文是学习笔记,并不是教程,所以会有很多我不理解或猜测的问题,也会有不尽详实之处,望见谅. 对于pc端网页设计师来说,移动端的网页制作,我之前只是简单的加了一个 <meta name=&qu ...
随机推荐
- 网页设计:Meta标签详解
很多人忽视了HTML标签META的强大功效,一个好的META标签设计可以大大提高你的个人网站被搜索到的可能性,有兴趣吗,谁我来重新认识一下META标签吧! META标签是HTML语言HEAD区的一个辅 ...
- CSS3属性border-radius绘制多种多样的图形
border-radius,国内翻译成圆角,你可能以为这个属性就是用来画圆角,没错,但是除此之外,它还可以做点别的事情.radius其实指的是边框所在圆的半径,这个CSS3属性不仅能够创建圆角,还可以 ...
- 拼图游戏(js,C#,java三种语言)
<html> <head> <meta charset="utf-8"> <style type="text/css" ...
- equals()的用法
比如,两个对象 c1, c2; 那么,c1.equals(c2) == true; 则表示c1, c2两个变量的值是一致的 equals适用于所有对象,这是一种特殊方法 equals这种表现形式我们一 ...
- 10-xargs 简明笔记
从标准你输入获取内容创建和执行命令 xargs [options] 选项 -n 数字,分组 示例 x ...
- [weird problem] the xm file transfered by wcf,some sections in it were always repeated
some sections in xml are always repeated,I received these file by wcf. I thought it's caused by buff ...
- linux基础-附件1 linux系统启动流程
附件1 linux系统启动流程 最初始阶段当我们打开计算机电源,计算机会自动从主板的BIOS(Basic Input/Output System)读取其中所存储的程序.这一程序通常知道一些直接连接在主 ...
- JNI系列——PassData
1.在工程目录下创建xxx.jni包并在该包下创建JNI类 2.在JNI类中声明所有的本地方法,并加载库 3.在MainActivity类中实例化JNI对象,并调用其方法 4.通过Javah生成的方法 ...
- Oracle 死锁的检测查询及处理
来源于: http://www.cnblogs.com/hoojo/archive/2012/08/31/2665583.html -- 死锁查询语句 SELECT bs.username " ...
- sql 定义自增id插入数据
-- 定义一个自增变量 ; -- 执行自增语句 ,sponsorbroker,,, from stock_listing_detailed_info group by sponsorbroker;