对于720px的设计稿，100vw == 720px，1vw == 7.2px;

vw可以替代rem 实现自适应布局。

相应的计算插件：postcss-px-to-viewport

********

** 翻转屏幕后，vw和vh会相应的变化。

　　比如：100vh，竖屏时相当于600px，横屏时则相当于320px。

参考：大漠自适应布局：http://www.w3cplus.com/css/vw-for-layout.html

css3宽高设置：calc() / vw / vh的更多相关文章

  1. Qt TabWidget QTabBar 宽高设置

    /*************************************************************************** * Qt TabWidget QTabBar ...

  2. IE6和IE7中<a>标签宽高设置无效的问题

    昨天写了一个引导界面, 发现界面中的IE67存在一个问题, 在某些情况下,  A锚链接如果设置了宽高,而且position:absolute的情况下, A标签的宽高无效, 至于总体的效果, 因为这个A ...

  3. JQuery的方便之处——宽高设置、坐标值和滚动条+事件绑定机制

    1.元素的宽高 可以通过css来进行设置,例如:$("元素").css({"宽度":"值","高度":"值&q ...

  4. 根据设备宽高设置View的大小

    得到设备屏幕宽高: WindowManager wManager = (WindowManager)context.getSystemService(Context.WINDOW_SERVICE); ...

  5. 为什么canvas宽高要设置在标签内>>宽高设置在style和设置在canvas的区别

    一直很困惑为什么canvas标签和其他标签不一样,宽高需要设置在canvas标签里,设置在style里就会有问题. 纯粹个人理解,有错误欢迎指出. > 结论写在头 设置在style里有问题其实是 ...

  6. ios UIWebView加载HTMLStr图文，关于图片宽高设置，webView内容实际高度的踩坑问题

    一.关于UIWebView 与 WKWebView 选取问题 从发布时间看: 2008年7月11日,在新一代iPhone3G正式发售当天,iPhone OS 2.0(iOS 2.0)推出,这时候就有U ...

  7. div宽高设置为百分比

    如果你将div的width和height设置为百分比,但是发现页面都不见了,这是因为父标签也要设置为百分比,也就是说body和html的宽高也需要设置为百分比 #containter{ width:1 ...

  8. nopi使用 设置列样式 宽高 设置分页符

    HSSFWorkbook book = new HSSFWorkbook(); ISheet sheet = book.CreateSheet("test_01"); sheet. ...

  9. A4纸网页打印——宽高设置

    一.在公制长度单位与屏幕分辨率进行换算时,必须用到一个DPI(Dot Per Inch)指标. 经过我仔细的测试,发现了网页打印中,默认采用的是96dpi,并非传闻的72dpi . A4纸张的尺寸是2 ...

随机推荐

  1. 基于Lua语言的触动精灵脚本开发

    工具下载 官网地址 连接模拟器 studio连接 首先要先下载ADB模拟器连接IDE,注意,这里一定要用官网提供的ADB,安卓开发的adb不行!!! 下载好之后,打开studio,输入Access K ...

  2. 55 Django静态文件配置

    一.Django静态文件配置 1.项目文件夹,新建一个文件夹statics 文件夹 2.在配置文件settings.py中,配置: 文件中有第句: STATIC_URL = '/static/'#静态 ...

  3. redis之数据类型以及使用

    1 redis数据类型 1. string类型: 字符串类型是 Redis 中最为基础的数据存储类型,它在 Redis 中是二进制安全的,也就是byte类型 最大容量是512M.2. hash类型: ...

  4. 『Python × C++』函数传参机制学习以及对比

    一.Python函数传参 在python中,函数传参实际上传入的是变量的别名,由于python内在的变量机制(名称和变量值相互独立),只要传入的变量不可变(tuple中的元素也要是不可变的才行),那么 ...

  5. Charles破解网站收藏（持续更新）

    1. 在这个网站(http://charles.iiilab.com/)下载破解文件 charles.jar 2. 替换掉原文件夹里的charles.jar Mac: /Applications/Ch ...

  6. js 获取数组重复的元素

    //获取数组重复的元素 function refrain(arr) { var tmp = []; if(Array.isArray(arr)) { arr.concat().sort().sort( ...

  7. SpringBoot使用Spring Initializer

    IDE都支持使用Spring的项目创建Spring的项目创建向导,快速创建一个SpringBoot项目:选择我们需要的模块:向导会联网创建SpringBoot项目:默认生成的SpringBoot项目: ...

  8. asp.net mvc中动作方法的重定向

    简单介绍一下mvc控制器下怎样重定向的其它页面 1.方式1:Response.Redirect重定向 //Response.Redirect方式跳转 Response.Redirect("~ ...

  9. List.contains()与自动拆箱

    最近项目引入sonarQube这种代码静态检查的东东,以前没有人力和精力review,现在只要扫描一下项目,就发现很多有趣的地方. 有这么一段代码: List<Long> list = L ...

  10. 回声UDP服务器端/客户端

    UDP是具有数据边界的协议,传输中调用I/O函数的次数非常重要.输入函数的调用次数要和输出函数的调用次数完全一致,这样才能保证接受全部已发送的数据. TCP套接字中需注册待传输数据的目标IP和端口,而 ...