好久都没更新博客了,最近一年转型移动端,当然网页端也得兼顾,慢慢写一写基本性的文章,多积累。

本期介绍下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使用的更多相关文章

  1. html5中viewport使用

    html5中viewport使用 转载自:http://www.maoegg.com/the-usage-of-viewport-in-html5/ 用html5开发移动应用时往往会遇到手机的分辨率或 ...

  2. HTML5之Viewport详解

    做移动Web开发也有一年多的时间了,虽然手机上浏览器对于PC上来说很友好了,但是手机各种设备的显示尺寸分辨率大小不一也要花大心思兼容它们. 关于HTML5中Viewport的文章Google,百度一搜 ...

  3. [转] 移动平台Html5的viewport使用经验

    转自:http://blog.csdn.net/wuruixn/article/details/8591989 问题描述 web页面采用html5技术实现,在系统登录页面中使用frameset.fra ...

  4. HTML5的viewport使用

    viewport 语法介绍: <!-- html document --> <meta name="viewport" content=" height ...

  5. html5中viewport与meta详解

    网上解释手机浏览器是把页面放在一个虚拟的"窗口"(viewport)中,通常这个虚拟的"窗口"(viewport)比屏幕宽,这样就不用把每个网页挤到很小的窗口中 ...

  6. HTML5 Viewport Meta Tag

    https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/U ...

  7. HTML5 viewport 标签与 CSS3 background-size 属性 使图片完全适应区域内容

    要使一张图片不论在移动端还是在桌面端都能适应区域内容,可以使用 HTML5 的 viewport 标签结合 CSS3 的 background-size 属性. 适应区域内容是指图片的宽或高的长度满足 ...

  8. cocos2d-js 入门 (主要是HTML5)

    cocos2d-js是cocos2d-x的JavaScript版本,真正跨全平台的游戏引擎,采用原生JavaScript语言,可发布到包括Web平台,iOS,Android,Windows Phone ...

  9. 2016.3.16__HTML5新特性__第八天

    HTML 5 + CSS 3 假设您认为这篇文章还不错,能够去H5专题介绍中查看很多其它相关文章. 今日代码非常冗杂,所以非常多内容直接摘自网上,假设造成您的不适.请留言告知. 非常感谢. 输入标签, ...

随机推荐

  1. ios开发过程中描述文件(provisioning profile)过期导致ios无法正常安装的处理办法

    1.登录开发者中心,重新编辑描述文件,获得最新的描述文件.(如果对应的P12文件也过期,需要同时下载最新的p12文件).----该步骤需要有权限的人才能操作. 2.下载最新的描述文件和p12文件(如果 ...

  2. shell 脚本实战笔记(5)--搭建资源的镜像服务器

    背景: 由于访问国外站点资源, 有时特别慢. 偶尔一次下载, 肯定还能忍受, 对于多次使用或者小团队内部使用, 搭建一个镜像站点, 无疑是个明智的决定. 这边以搭建CDH5的yum源镜像, 作为例子, ...

  3. HDU 5178:pairs(二分,lower_bound和upper_bound)

    pairs Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total Subm ...

  4. About DOM

    文档对象模型,简称DOM.是HTML页面结构给javascript提供的一个入口,它就像一个桥梁,连接两者的关系.通过DOM,JavaScript拥有访问并修改HTML的权限. 一.DOM模型: 首先 ...

  5. MacOS 快捷键技巧

    Ctrl+↑打开mission ctrl 可以在mission ctrl 里新建桌面 ,通过Ctrl+←→切换桌面 可以拖拽应用窗口到新的桌面 Ctrl+↓可以打开fonder的所有窗口 F11 全屏

  6. test20181015 B君的第二题

    题意 分析 考场85分 用multiset暴力,由于教练的机子飞快,有写priority_queue水过了的人. #include<cstdlib> #include<cstdio& ...

  7. STS或eclipse安装SVN插件(转)

    安装sts--SVN插件 简介:sts是与eclipse类似的Java IDE开发工具(不了解的百度) 1.sts菜单栏 help->install New Software 依据大家的版本选择 ...

  8. PHP com组件的使用 (环境搭建 以及测试)

    COM 组件在实际当前的软件开发中依然是比较重要,包括对于串口开发的人员,软件插件使用的人员,PHP 已经为我们添加了对于 COM的支持,可以很好的解决我们在开发中可能碰到的一些问题.一下是开发环境的 ...

  9. silverlight 进行本地串口调用的一种可行的解决方法 之silverlight端代码

    接上边的文章. 在javascript暴露操作activex 串口接收之后,就是silverlight端进行串口数据的显示,我们的显示方式比较简单,只是为了演示,我们每隔1秒进行数据的获取并显示, 为 ...

  10. tomcat源码阅读之StandardWrapper解析

    一.UML图: 1.Tomcat中Wrapper代表一个独立的servlet实例,StandardWrapper类是Wrapper接口的标准实现类,StandardWrapper类还实现了Selvle ...