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

本期介绍下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. Docker教程-01.安装docker-ce-18.06

    参考文章:http://www.runoob.com/docker/docker-tutorial.html 1.Docker简介 1)Docker 是一个开源的应用容器引擎,基于 Go 语言 并遵从 ...

  2. / is not a valid selector

  3. VS2013、VS2015中,新建项目没有看到解决方案的问题(已解决)

    问题描述:装好VS2013 专业版 for Update5不知怎么弄的,突然新建项目没有了解决方案,于是各种折腾,最后终于解决了! ================================== ...

  4. 《DSP using MATLAB》Problem 4.8

    代码: %% ---------------------------------------------------------------------------- %% Output Info a ...

  5. hdu1355

    题意:有一片矩形花生田在路的一侧,田上的整数坐标位置有0个或多个花生,现规定从路上走到田地最边上的某个格点位置.从田边上走回路上.从一个格点移动到另一个格点.采摘格点上的花生,这四种动作都要花费一单位 ...

  6. mongo dos操作

    https://www.cnblogs.com/beileixinqing/p/8241822.html 基础1 https://blog.csdn.net/superjunjin/article/d ...

  7. 在函数内部定义的函数 this 指向 undefined

    在函数内部定义的函数 this 指向 undefined 以下这个 this 就是指向 undefined. 但在非 strict 模式下是指向 window <script> 'use ...

  8. Oracle 补丁体系 及 opatch 工具 介绍

    一. CPU(Critical Patch Update) 一个CPU内包含了对多个安全漏洞的修复,并且也包括相应必需的非安全漏洞的补丁.CPU是累积型的,只要安装最新发布的CPU即可,其中包括之前发 ...

  9. Excel的方向键失灵

    Excel的方向键操作不再是sheet范围内转动:而是变成了整个sheet页面在跳动. 不只是Excel,viso也是如此. 这是因为你的Scroll Lock键被按下了:所致箭头被解读为页面滚轮在滑 ...

  10. 解决首次访问jenkins,输入初始化默认密码之后,一直卡住问题,无法进行jenkins工具安装

    参考网址:http://www.cnblogs.com/520playboy/p/6244257.html 简介   安装系统:centos6.5 安装方式:在官网中下载jenkins.war,放到t ...