这几天在搞微信公众平台,涉及到几个页面要写,可是当我测试时发现和想象中不太一样,于是去找了几个页面看了下,发现他们页面头部有 meta viewport 的标签,所以去找了下网上的资料,发现千篇一律,而且有的排版极其难看,所以我复制过来自己重新排版下、

参数说明
-
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
width :
控制viewport的大小,可以指定一个值,如600, 或者特殊的值,如device-width为设备的宽度(单位为缩放为100%的CSS的像素)
height :
和width相对应,指定高度
initial-scale :
初始缩放比例,页面第一次加载时的缩放比例
maximum-scale :
允许用户缩放到的最大比例,范围从0到10.0
minimum-scale :
允许用户缩放到的最小比例,范围从0到10.0
user-scalable :
用户是否可以手动缩放,值可以是:yes/true允许用户缩放;no/false不允许用户缩放

移动端网页开发 meta 之 viewport的更多相关文章

  1. 移动端网页常用meta

    今天在对前公司的某直播室前端进行改版时,整理了一下平时移动端页面开发时,最常用的meta.如下: <!--定义页面制作者,可以留姓名,也可以留联系方式--> <meta name=& ...

  2. 微信或移动端网页的meta

    针对微信: <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> ...

  3. HTML5 Mobile 适应移动端的屏幕<meta name='viewport' content='xxxx'>

    网页手机wap2.0网页的head里加入下面这条元标签,在移动端的浏览器中页面将以原始大小显示,并不允许缩放. 加入 如下代码 即可自适应移动端的屏幕: <meta name="vie ...

  4. 移动web开发--meta 之 viewport

    常用的 viewport meta 如下: 1 <meta name="viewport" content="width=device-width,initial- ...

  5. 移动端web开发初探之Vuejs的简单实战

    这段时间在做的东西,是北邮人论坛APP的注册页.这个注册页是内嵌的网页,因为打算安卓和IOS平台同时使用.因此实际上就是在做移动端的web开发了. 在这过程中遇到了不少有意思的东西. DEMO的git ...

  6. 从零开始学 Web 之 移动Web(二)JD移动端网页,移动触屏事件

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  7. 移动端网页宽度值(未加meta viewport标签)

    移动端网页宽度值(未加meta viewport标签): iphone:980px Galaxy(盖乐世):980px Nexus:980px blackberry(黑莓):980px LG:980p ...

  8. h5 移动端开发自适应 meta name="viewport"的使用总结

    本文系个人理解,可能有误差,仅供参考,谨慎采纳! 布局视口: 系统自带 一般大于屏幕宽度 理想宽度:  设置页面的viewport 的一个宽度,使不同的手机的布局视口宽度尽量接近可视窗口的值: 可视视 ...

  9. 移动端开发(一. Viewport(视窗))

    手机与浏览器 移动端开发主要针对手机,ipad等移动设备,随着地铁里的低头族越来越多,移动端开发在前端的开发任务中站的比重也越来越大.各种品牌及尺寸的手机也不尽相同.尺寸不同就算了分辨率,视网膜屏  ...

随机推荐

  1. 【原】python3.7 无法pip安装提示ssl错误解决方案

    问题 pip is configured with locations that require TLS/SSL, however the ssl module in Python is not av ...

  2. 吉他软件Guitar Pro播放无声音的解决方法

    系统环境:适用于Windows操作系统和macOS的Guitar Pro . 问题表现:已成功安装Guitar Pro ,但用Guitar Pro 播放时没有任何声音或播放失真. 解决方案:首先确保安 ...

  3. 第十六次ScrumMeeting博客

    第十六次ScrumMeeting博客 本次会议于12月5日(二)22时整在3公寓725房间召开,持续20分钟. 与会人员:刘畅.张安澜.赵奕.方科栋. 1. 每个人的工作(有Issue的内容和链接): ...

  4. Daily Scrum NO.3

    工作概况 符美潇(PM) 昨日完成的工作 1.Daily Scrum.日常会议及日常工作的分配和查收. 2.整合各DEV所写的代码,在TFS上进行Beta阶段第一次代码签入. 今日工作 1.Daily ...

  5. 2017-2018 第一学期201623班《程序设计与数据结构》-第5&6周作业问题总结

    一.作业内容 第5周作业 http://www.cnblogs.com/rocedu/p/7484252.html#WEEK05 第6周作业 http://www.cnblogs.com/rocedu ...

  6. Github作为图床的一个小坑

    Github作为图床的一个小坑 前言 听了少铭同学建议把github作为图床,结果遇到了一个小坑,总是显示不出来图片. 问题描述与解决 形如下的链接是显示不出来的: https://github.co ...

  7. 在vue中如何动态修改title标签的值

    建议用vue-wechat-title插件为微信动态设置标题 1,首先安装插件 cnpm install vue-wechat-title --save 2,在main.js中引入 Vue.use(r ...

  8. robotframework常用的几个快捷键

    robotframework常用的几个快捷键 重命名(F2) 搜索关键字(F5) 执行用例(F8) 创建新工程(ctrl+n) 创建新测试套(ctrl+shift+f) 创建新用例(ctrl+shif ...

  9. 小菜菜mysql练习解读分析2——查询存在" 01 "课程但可能不存在" 02 "课程的情况(不存在时显示为 null )

    “查询存在" 01 "课程但可能不存在" 02 "课程的情况(不存在时显示为 null )” ——翻译为:课程表里面,存在01的信息,未必满足有02的课程情况 ...

  10. 【USACO 1.4】Combination Lock

    /* TASK:combo LANG:C++ URL:http://train.usaco.org/usacoprob2?a=E6RZnAhV9zn&S=combo SOLVE:自己做,想的是 ...