这几天在搞微信公众平台,涉及到几个页面要写,可是当我测试时发现和想象中不太一样,于是去找了几个页面看了下,发现他们页面头部有 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. shell脚本之基础

    配置启动界面 vim /etc/inittab/  init3配置网卡 重启生效system-config-network网卡配置文件vim /etc/sysconfig/network-script ...

  2. DFA化简

    首先是未化简DFA的转换表 NFA状态 DFA状态 a b {0,1,2,4,7} A B C {1,2,3,4,6,7,8} B B D {1,2,4,5,6,7} C B C {1,2,4,5,6 ...

  3. 《Linux内核分析》第三周笔记 构造一个简单的Linux系统MenuOS

    构造一个简单的Linux系统MenuOS 一.linux内核源代码简介 三大法宝(存储程序计算机.函数调用堆栈.中断)和两把宝剑(中断上下文的切换:保存现场和恢复现场.进程上下文的切换) 1.在lin ...

  4. hibernate 创建工厂类

    package cn.hibernate; import org.hibernate.SessionFactory; import org.hibernate.cfg.Configuration; / ...

  5. C#简述(二)

    详情请参考:http://www.runoob.com/csharp/csharp-operators.html 1.C# 运算符 算术运算符 关系运算符 逻辑运算符 位运算符 赋值运算符 其他运算符 ...

  6. Alpha 冲刺六

    团队成员 051601135 岳冠宇 051604103 陈思孝 031602629 刘意晗 031602248 郑智文 031602234 王淇 会议照片 今天没有进行站立式会议,由于团队内有些细节 ...

  7. PAT 甲级 1068 Find More Coins

    https://pintia.cn/problem-sets/994805342720868352/problems/994805402305150976 Eva loves to collect c ...

  8. Confluence的简单安装以及与jira链接(Confluence不知道有没有破解)

    1. 前提是安装好了jira以及下载好了confluence的安装包 这里 jira的版本是 7.2.4 confluence的版本是6.8 2. 服务器上面有sqlserver数据库. 3. 为了便 ...

  9. Android Tab类型主界面 Fragment+TabPageIndicator+ViewPager

    文章地址: Android项目Tab类型主界面大总结 Fragment+TabPageIndicator+ViewPager 1.使用ViewPager + PagerAdapter 每个页面的内容都 ...

  10. SpringBoot 5.SpringBoot小知识讲解

    1.修改 server 端口: 在 application.properties 中添加 server.port=9090,我们的端口号就会变成9090了. 2.自定义配置Web: 2.1 创建 Cu ...