HTML5之viewport使用
好久都没更新博客了,最近一年转型移动端,当然网页端也得兼顾,慢慢写一写基本性的文章,多积累。
本期介绍下viewport的一些使用:
先看看viewport在页面中的样子:
<meta name="viewport" content="initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=no">
先罗列下移动页面遇到的单位:
px、pt、pc、sp、em、rem、dp、dip、ppi、dpi、ldpi、mdpi、hdpi、xhdpi、xxhdpi……
手机浏览器是把页面放在一个虚拟的“窗口”(viewport)中,窗口可大于或小于手机的可视区域,一般手机默认viewport大于可视区域。这样不会破坏没有针对手机浏览器优化的网页的布局,用户可以通过平移和缩放来看网页的其他部分。
HTML5之viewport使用的更多相关文章
- html5中viewport使用
html5中viewport使用 转载自:http://www.maoegg.com/the-usage-of-viewport-in-html5/ 用html5开发移动应用时往往会遇到手机的分辨率或 ...
- HTML5之Viewport详解
做移动Web开发也有一年多的时间了,虽然手机上浏览器对于PC上来说很友好了,但是手机各种设备的显示尺寸分辨率大小不一也要花大心思兼容它们. 关于HTML5中Viewport的文章Google,百度一搜 ...
- [转] 移动平台Html5的viewport使用经验
转自:http://blog.csdn.net/wuruixn/article/details/8591989 问题描述 web页面采用html5技术实现,在系统登录页面中使用frameset.fra ...
- HTML5的viewport使用
viewport 语法介绍: <!-- html document --> <meta name="viewport" content=" height ...
- html5中viewport与meta详解
网上解释手机浏览器是把页面放在一个虚拟的"窗口"(viewport)中,通常这个虚拟的"窗口"(viewport)比屏幕宽,这样就不用把每个网页挤到很小的窗口中 ...
- HTML5 Viewport Meta Tag
https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/U ...
- HTML5 viewport 标签与 CSS3 background-size 属性 使图片完全适应区域内容
要使一张图片不论在移动端还是在桌面端都能适应区域内容,可以使用 HTML5 的 viewport 标签结合 CSS3 的 background-size 属性. 适应区域内容是指图片的宽或高的长度满足 ...
- cocos2d-js 入门 (主要是HTML5)
cocos2d-js是cocos2d-x的JavaScript版本,真正跨全平台的游戏引擎,采用原生JavaScript语言,可发布到包括Web平台,iOS,Android,Windows Phone ...
- 2016.3.16__HTML5新特性__第八天
HTML 5 + CSS 3 假设您认为这篇文章还不错,能够去H5专题介绍中查看很多其它相关文章. 今日代码非常冗杂,所以非常多内容直接摘自网上,假设造成您的不适.请留言告知. 非常感谢. 输入标签, ...
随机推荐
- cmd 环境变量设置的简单方法
1.查看当前所有可用的环境变量:输入 set 即可查看. 2.查看某个环境变量:输入 “set 变量名”即可,比如想查看temp变量的值,即输入 set temp 3.修改环境变量 :输入 “set ...
- magento 如何制作模板
我个人认为Magento模板制作的难点在于不了解Magento的架构,不会调动block.Magento的block调动几乎都是靠xml.在下面的内容会提及如何操作. 制作Magento模板的前提是: ...
- 强化学习 reinforcement learning: An Introduction 第一章, tic-and-toc 代码示例 (结构重建版,注释版)
强化学习入门最经典的数据估计就是那个大名鼎鼎的 reinforcement learning: An Introduction 了, 最近在看这本书,第一章中给出了一个例子用来说明什么是强化学习, ...
- Android shell command execute Demo
package com.android.utils; import java.io.File; import java.io.IOException; import java.io.InputStre ...
- 为什么我们不应该使用微信或者 QQ 作为团队协作的 IM 工具?
如果你的团队没有觉得微信是低效的团队 IM 工具,那只有两种可能: 团队成员很少使用微信进行私人的生活和娱乐. 你就是一个低效的团队,而且还不自知. 本文内容 微信,连接一切 每个人都有微信 微信,低 ...
- int? 竟然真的可以是 null!.NET/C# 确定可空值类型 Nullable 实例的真实类型
使用 Nullable<T> 我们可以为原本不可能为 null 的值类型像引用类型那样提供一个 null 值.不过注意:Nullable<T> 本身也是个 struct,是个值 ...
- hive中实现类似MySQL中的group_concat功能
hive> desc t; OK id string str string Time taken: 0.249 seconds hive> select * from t ...
- CTF-练习平台-Misc之 这么多数据包
十一.这么多数据包 下载文件后解压,用wireshark打开CTF.pcapng,发现有很多包,快速浏览后发现前面都是攻击机(192.168.116.138)在向目标机(192.168.116.159 ...
- Microsoft - Find Biggest Node
public Node findBiggest (Node n1, Node n2){ Node c1 = n1; Node c2 = n2; boolean isPositive = false; ...
- Jenkins系列之Jenkins配置常用工具和如何下载插件
上一篇我们介绍了Jenkins的安装,这一篇我们介绍如何配置Jenkins的工具和如何下载插件. 首先我们先来看如何配置工具,这里的工具是指JDK.Ant.Maven.Git等. 1.点击系统管理,如 ...