前端移动开发--viewpoint
移动开发时,一般都会在头部加载这样一行meta标签
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
这一行什么意思呢?
viewport就是设备的屏幕上能用来显示我们的网页的那一块区域,默认的viewport是layout viewport,也就是那个比屏幕要宽的viewport,但在进行移动设备网站的开发时,我们需要的是ideal viewport。width=device-width表示当前的viewpoint等于设备的宽度,width用来设置layout viewport的宽度,height用来设置layout viewport的高度。initial-scale=1.0表示页面的初始缩放值为1,maximum-scale允许用户的最大缩放值,minimum-scale允许用户的最小缩放值,user-scalable表示是否允许用户缩放,“no”不允许,“yes”允许。
关于缩放
缩放指的是相对于ideal viewport来进行的,比如<meta name="viewport" content="width=500, initial-scale=1">,width=500表示把当前的viewport宽度设为500,initial-scale=1则表示把当前viewport的宽度设为ideal viewport的宽度,浏览器该怎么办呢,一般会取较大的那个值。
前端移动开发--viewpoint的更多相关文章
- 构建一个基本的前端自动化开发环境 —— 基于 Gulp 的前端集成解决方案(四)
通过前面几节的准备工作,对于 npm / node / gulp 应该已经有了基本的认识,本节主要介绍如何构建一个基本的前端自动化开发环境. 下面将逐步构建一个可以自动编译 sass 文件.压缩 ja ...
- [web建站] 极客WEB大前端专家级开发工程师培训视频教程
极客WEB大前端专家级开发工程师培训视频教程 教程下载地址: http://www.fu83.cn/thread-355-1-1.html 课程目录:1.走进前端工程师的世界HTML51.HTML5 ...
- 基于webpack的前端工程化开发解决方案探索(一):动态生成HTML(转)
1.什么是工程化开发 软件工程的工程化开发概念由来已久,但对于前端开发来说,我们没有像VS或者eclipse这样量身打造的IDE,因为在大多数人眼中,前端代码无需编译,因此只要一个浏览器来运行调试就行 ...
- MVVM开源框架Knot.js 教程2 - 大幅改变前端框架开发体验的Debugger
Knotjs教程系列 1.CBS初步 2.Knot.js Debugger(本文) ....持续增加中 Knot.js 教程2 - 改变前端框架开发体验的Debugger Debugger只是一个方便 ...
- Viewport Resizer下载 谷歌前端自适应开发工具
原文链接:http://www.phpbiji.cn/article/index/id/107/cid/6.html Viewport Resizer下载 谷歌前端自适应开发工具 在前端开发过程中,随 ...
- 前端模块化开发学习之gulp&browserify篇
随着web应用的发展,前端的比重占得越来越多,编写代码从而也越来越复杂.而通常我们需要将不同功能或者不同模块的代码分开写,最后在html中一起加载,这样做是可以的,但是当你需要进行维护或者是二次开发 ...
- 前端教程&开发模块化/规范化/工程化/优化&工具/调试&值得关注的博客/Git&面试-资源汇总
内容精简 资源这么多,多看看多学习再总结肯定是好的.多读读就算看重了不算浪费时间,毕竟一千个读者就有一千个林黛玉,还有温故而知新,说不定多读一些内容,就发现惊喜了呢.不过,在此也精简一些内容,就1~2 ...
- 【招聘】.NET高级开发、前端高级开发、测试工程师
.NET架构师 工作地点:厦门-湖里区 工作年限:5年及以上 学历要求:大专或以上 工资范围:15000元 - 25000元 福利待遇:五险一金,带薪年休假,年度旅游,丰富的员工团队活动:生日会.中秋 ...
- 移动前端webApp开发点滴积累20140629
#移动前端webApp开发点滴积累20140629 ##关于input行内居中的问题 给input设定一个比较高的高度,在某些版本的移动设备上,文字不能垂直居中,即使设定了相同的行高也不行.(见图) ...
随机推荐
- django2 + python3 显示静态文件中的图片
之前一直搞不出来 是因为图片的问题,步骤也就是固定的几步,到位了就差不多成了 文件夹结构: . ├── HelloWorld │ ├── __init__.py │ ├── __pycache ...
- BZOJ 2060: [Usaco2010 Nov]Visiting Cows 拜访奶牛 树形DP
Code: #include <bits/stdc++.h> #define setIO(s) freopen(s".in","r",stdin) ...
- BZOJ 4836: [Lydsy1704月赛]二元运算 分治FFT
Code: #include<bits/stdc++.h> #define ll long long #define maxn 500000 #define setIO(s) freope ...
- qt qsplashscreen 启动画面 延时
intdelayTime=3; QElapsedTimer timer; timer.start(); while(timer.elapsed()<(delayTime*1000)) { app ...
- NOIp 图论算法专题总结 (1):最短路、最小生成树、最近公共祖先
系列索引: NOIp 图论算法专题总结 (1) NOIp 图论算法专题总结 (2) NOIp 图论算法专题总结 (3) 最短路 Floyd 基本思路:枚举所有点与点的中点,如果从中点走最短,更新两点间 ...
- 配置自己的CocoaPods库
序 默认安装的cocoapods确实很好用,可是毕竟自己会写一些库和修改一些第三方库来用.所幸cocoapods确实是一个神器.他可以定义自己的库来用. 如何安装Cocoapods,请参考这篇 从头来 ...
- p4111 [HEOI2015]小Z的房间[简述矩阵树定理]
分析 [1]无向图 图G的度数矩阵为D,邻接矩阵为A 我们定义这个图的Kirchhoff矩阵为D-A 这个矩阵的任意一个n-1阶主子式的行列式的绝对值就是这个图的生成树个数 [2]有向图 如果要求内向 ...
- MySQL 中的 information_schema 数据库
1. 概述 information_schema 数据库跟 performance_schema 一样,都是 MySQL 自带的信息数据库.其中 performance_schema 用于性能分析,而 ...
- PTA 1154 Vertex Coloring
题目链接:1154 Vertex Coloring A proper vertex coloring is a labeling of the graph's vertices with colors ...
- sessionStorage、localStorage与cookie
sessionStoage:容量大.安全.临时存储,跨页面 localStorage: 容量大.安全.永久存储.跨页面 应用: <!-- 存储页面 test-local --> <t ...