移动端网页开发 meta 之 viewport
这几天在搞微信公众平台,涉及到几个页面要写,可是当我测试时发现和想象中不太一样,于是去找了几个页面看了下,发现他们页面头部有 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的更多相关文章
- 移动端网页常用meta
今天在对前公司的某直播室前端进行改版时,整理了一下平时移动端页面开发时,最常用的meta.如下: <!--定义页面制作者,可以留姓名,也可以留联系方式--> <meta name=& ...
- 微信或移动端网页的meta
针对微信: <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> ...
- HTML5 Mobile 适应移动端的屏幕<meta name='viewport' content='xxxx'>
网页手机wap2.0网页的head里加入下面这条元标签,在移动端的浏览器中页面将以原始大小显示,并不允许缩放. 加入 如下代码 即可自适应移动端的屏幕: <meta name="vie ...
- 移动web开发--meta 之 viewport
常用的 viewport meta 如下: 1 <meta name="viewport" content="width=device-width,initial- ...
- 移动端web开发初探之Vuejs的简单实战
这段时间在做的东西,是北邮人论坛APP的注册页.这个注册页是内嵌的网页,因为打算安卓和IOS平台同时使用.因此实际上就是在做移动端的web开发了. 在这过程中遇到了不少有意思的东西. DEMO的git ...
- 从零开始学 Web 之 移动Web(二)JD移动端网页,移动触屏事件
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- 移动端网页宽度值(未加meta viewport标签)
移动端网页宽度值(未加meta viewport标签): iphone:980px Galaxy(盖乐世):980px Nexus:980px blackberry(黑莓):980px LG:980p ...
- h5 移动端开发自适应 meta name="viewport"的使用总结
本文系个人理解,可能有误差,仅供参考,谨慎采纳! 布局视口: 系统自带 一般大于屏幕宽度 理想宽度: 设置页面的viewport 的一个宽度,使不同的手机的布局视口宽度尽量接近可视窗口的值: 可视视 ...
- 移动端开发(一. Viewport(视窗))
手机与浏览器 移动端开发主要针对手机,ipad等移动设备,随着地铁里的低头族越来越多,移动端开发在前端的开发任务中站的比重也越来越大.各种品牌及尺寸的手机也不尽相同.尺寸不同就算了分辨率,视网膜屏 ...
随机推荐
- 通过sqli-labs学习sql注入——基础挑战之less1
环境准备: Phpstudy (PHP+Apache+Mysql) Sql-lab 首先了解下基础知识: URL编码: 因为在浏览器中,当我们访问一个网址的时候,浏览器会自动将用户输入的网址进行UR ...
- PAT甲题题解-1106. Lowest Price in Supply Chain (25)-(dfs计算树的最小层数)
统计树的最小层数以及位于该层数上的叶子节点个数即可. 代码里建树我用了邻接链表的存储方式——链式前向星,不了解的可以参考,非常好用: http://www.cnblogs.com/chenxiwenr ...
- Daily Scrum NO.7
工作概况 今日由于时间比较充裕,没有编译作业的干扰,团员们的进度喜人.线程池.动态爬取.异常清理这三个主要开发工作已经步入尾声.其中线程池开发工作的代码已经签入,现主要在测试和优化.动态爬取今日也签入 ...
- 将搬家至CSDN
emmm,感觉没利用好博客,自己也弄了一个github上面的hexo博客https://clarkkun.github.io/,但是死活传不上去内容,尴尬 ̄□ ̄||,三个博客齐头并进吧
- Sprint 1 Review & Daily Scrum - 11/18
今天我们组利用课后的时间对Sprint 1阶段进行了回顾,并对接下来的工作进行了安排. Sprint 1阶段我们开始定的计划是完成最基础的背单词功能,可以让用户可以完整地走一遍背单词流程.回顾上周,我 ...
- Believe
虽然上了一周的软件工程,可是还是不造软件工程是干什么的.听了一节gitlab,似懂非懂,感觉很高大上的样子,自己折腾了许久,还是没有进展,真心无奈. 真是件考验耐性的事~不过,so what?会成功的 ...
- [转帖]shell 中的>/dev/null 2>&1 是什么鬼?
shell 中的>/dev/null 2>&1 是什么鬼? http://blog.jobbole.com/109355/ 背景 我们经常能在shell脚本中发现>/dev/ ...
- CentOS 简单学习 firewalld的使用
1. centos7 开始 使用firewalld 代替了 iptables 命令工具为 firewall-cmd 帮助信息非常长,简单放到文末 2. 简单使用 首先开启 httpd 一般都自带安装了 ...
- 微信小游戏 项目配置文件 project.config.json
一.项目配置文件project.config.json 小程序开发者工具在每个项目的根目录都会生成一个 project.config.json,在工具上做的任何配置都会写入到这个文件,当重新安装工具或 ...
- idea中添加类和方法注释以及codeCheck
前言:在idea中我们添加类以及类的方法的注释很有必要,让其他人能够看懂这个类或者函数的作用是什么:为了在开发过程中检查自己的编程规范,可以通过codecheck工具进行自我检查和约束 一.在idea ...