博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
viewport Meta Tag
阅读量:6192 次
发布时间:2019-06-21

本文共 940 字,大约阅读时间需要 3 分钟。

  hot3.png

  1. 网页手机wap2.0网页的head里加入下面这条元标签,在iPhone的浏览器中页面将以原始大小显示,并不允许缩放。
  2. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
  3. width - viewport的宽度 height - viewport的高度
  4. initial-scale - 初始的缩放比例
  5. minimum-scale - 允许用户缩放到的最小比例
  6. maximum-scale - 允许用户缩放到的最大比例
  7. user-scalable - 用户是否可以手动缩放

 

viewport Meta 标记

今天来说说viewport Meta标记。这个标记最开始是由苹果引进的,用来标记移动设备的浏览器的视口大小。现在,这个标记也已经被Android接受。不止如此,除了WebKit内核的浏览器,Mozilla也接受了这个标记。据说,HTML5也将正式引入这个标记。

在<head>中,写下以下代码

<meta name="viewport" content="width=device-width; user-scalable=0;" />

就可以让您的网页适应移动浏览器的大小。

视口,和ps中的画布比较相像。

下面解释一下viewport的meta标记中各个参数的具体意义。

width

视口的宽度。可以使用像素值,但推荐使用device-width关键字。表示依照设备屏幕的宽度。

height

视口的高度。不用指定。

user-scalable

用户是否可以缩放视口。

值可以是:
1, yes, or true: 允许用户缩放
0, no, or false: 不许用户缩放

initial-scale

初始缩放值。比如1.0表示一个视口像素等于一个屏幕像素。

minimum-scale

最小比例值。范围从0至10.0

maximum-scale

最大比例值。范围从0至10.0

转载于:https://my.oschina.net/wzzz/blog/178542

你可能感兴趣的文章
Spring Boot整合Quartz实现定时任务表配置
查看>>
Arcgis for Js实现graphiclayer的空间查询(续)
查看>>
【树莓派】服务配置相关2:基于RPi Desktop的服务配置
查看>>
Spark Mllib里的本地向量集(密集型数据集和稀疏型数据集概念、构成)(图文详解)...
查看>>
Android Studio 3.0 下载 使用新功能介绍
查看>>
ARM-Linux中断系统
查看>>
ibatis中使用缓存
查看>>
电商总结(八)如何打造一个小而精的电商网站架构
查看>>
用C#实现字符串相似度算法(编辑距离算法 Levenshtein Distance)
查看>>
java:练习学校学生
查看>>
新概念英语(1-115)Knock! Knock!
查看>>
Python 数据结构
查看>>
EntityFramework 插件之EntityFramework.Extended (批量处理)
查看>>
android自动化测试中hierarchyviewer和uiautomatorviewer获取控件信息的方式比对(1)
查看>>
hbase shell 启动报错
查看>>
课程一(Neural Networks and Deep Learning),第三周(Shallow neural networks)—— 1、两层神经网络的单样本向量化表示与多样本向量化表示...
查看>>
npm常用命令
查看>>
Find Blank Cell in Excel
查看>>
sbt编译spark程序提示value toDF is not a member of Seq()
查看>>
学倦乱语
查看>>