Viewport
手机浏览器是把页面放在一个虚拟的“窗口”(viewport)中,通常这个虚拟的“窗口”(viewport)比屏幕宽,
这样就不用把每个网页挤到很小的窗口中(这样会破坏没有针对手机浏览器优化的网页的布局),用户可以通过平移和缩放来看网页的不同部分。
Viewport 基础
一个常用的针对移动网页优化过的页面的 viewport meta 标签大致如下:
<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1">
width:控制 viewport 的大小,可以指定的一个值,如果 600,或者特殊的值,如 device-width 为设备的宽度(单位为缩放为 100% 时的 CSS 的像素)。
height:和 width 相对应,指定高度。
initial-scale:初始缩放比例,也即是当页面第一次 load 的时候缩放比例。
maximum-scale:允许用户缩放到的最大比例。
minimum-scale:允许用户缩放到的最小比例。
user-scalable:用户是否可以手动缩放
viewport并非只是ios上的独有属性,在android、winphone上同样也有viewport。它们要解决的问题是相同的,即无视设备的真实分辨率,直接通过dpi,在物理尺寸和浏览器之间重设分辨率,这个分辨率和设备的分辨率无关。
通过设置viewport让页面在浏览器里有相同的分辨率。比如网站是800px宽,可以通过设置viewport的width=800,来让网站在这几种不同的设备上都刚好满屏显示。
- 浏览: 160031 次
- 性别:
- 来自: 武汉
最新评论
-
yogurt2012:
请问··我如果要调试H2数据库来分析其JOIN算法应该怎么做呢 ...
H2笔记 -
carlosfu:
很好很全,很有收获
Spring3笔记之 JDBC -
ponlya:
coldrush 写道看了你的配置 ,刚绝 file:后加绝对 ...
添加使用dtd文件 -
ponlya:
byp19980911 写道这不是很好的解决办法,最好是使用连 ...
java.net.SocketException:Software caused connection abort: socket write error -
ponlya:
ayanami001 写道为什么spring没有封装分页吗,那 ...
Spring3笔记之 JDBC(分页)
相关推荐
什么是Viewport 手机浏览器是把页面放在一个虚拟的“窗口”(viewport)中,通常这个虚拟的“窗口”(viewport)比屏幕宽,这样就不用把每个网页挤 到很小的窗口中(这样会破坏没有针对手机浏览器优化的网页的布局)...
本节介绍 Ext的Border布局以及如何创建一个Viewport。 1、Viewport介绍: Viewport 是一类特殊的容器。它创建后会自动填充到整个页面区域,并能自动适应页面缩放。一般作为用用程序全局容器使用。 2、Border布局...
viewport响应式模板
前端开源库-postcss-px-to-viewportpostss px to viewport,一种将px转换为viewport单位(vw、vh、vmin、vmax)的CSS后置处理器。
WPF三维立体动画源码 利用viewport3D来呈现
3D视图自动切换捕捉脚本 Viewport Auto-Snap
一个功能强大的viewport程序实例,可以满足你多种需要调节。
h5 中viewport的详解,只有明白了viewport的概念以及弄清楚了跟viewport有关的meta标签的使用,才能更好地让我们的网页适配或响应各种不同分辨率的移动设备。
ember-in-viewport, 在 viewport @ 60FPS,检测Ember视图或者组件是否为 ember-in-viewport检测Ember视图或者组件是否位于 viewport @ 60 FPS 。美国船厂建立和维护收费 ,请与我们联系,咨询专家 Ember.js 。读取 ...
[Bootstrap_3][中文]_02._Bootstrap原理,@media_與_viewport
前端开源库-viewport-list视区列表,返回设备及其视区的列表
一步一步使用Ext JS MVC与Asp.Net MVC 3开发简单的CMS后台管理系统之创建Viewport(2)源代码
前端开源库-postcss-px-to-viewport.zip
该程序是基于HelixToolkit.wpf,实现了3D模型的缩放旋转平移。
viewportSize, 使用JavaScript获取 CSS viewport的大小 viewportSize允许你使用JavaScript获取 CSS viewport的宽度和高度。作者:Tyson Matanich http://matanich.com 。许可证:MIT演示:http://matanich
前端开源库-postcss-viewport-unitsPostSS视区单位,自动附加
前端项目-viewport-units-buggyfill,使视区单元(vh_vw_vmin_vmax)在旧WebKit和Trident中正常工作
verge, 在视口中,获取viewport尺寸,检测元素 compact 是一组用本机JavaScript编写的跨浏览器 视口实用程序。 它包括检测元素是否位于当前视口中的能力。 它作为独立模块。ender模块或者作为 jQuery插件插件运行。 ...
viewport-mercator-project, 利用墨卡托投影的地图变换器 viewport-mercator-project | 文档支持韦伯投影的投影和相机工具。 它的核心是一个转换到地图坐标( 例如 )的工具。 ,) screen屏幕坐标和背面。是谁?专门为...
WPF中模型的3D 显示,可以进行模型转换控制,主要用于学习研究,