对于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. p2751 Job Processing

    如果单单只安排过程1的时间最短,很容易算出来.用优先队列取最小,加上增量后再放回就行.对过程2也进行这样的操作.将过程1第一个完成的在过程2最后一个完成.以样例来说,过程1:1,1,2,2,3,过程2 ...

  2. 父子元素select悬浮代码，兼容火狐

    //公共切换方法 function SwitchCommon() { //悬浮显示 $(document.body).on("mouseenter", "[hex-eid ...

  3. Git创建新项目

    1. git init 2. git remote add origin 3. git pull origin --allow-unrelated-histories 4. git push orig ...

  4. SQL SERVER 一组数据按规律横着放置，少则补空，如人员按一进一出的规律，进出为一组，缺少的补null

    假设一组数据:人员进出刷卡数据表[SwingCard] ID MenID Door 1 1 In 2 1 In 3 1 Out 4 1 In 5 1 Out 6 1 Out 想要变成如下:一进一出为一 ...

  5. Matlab-1:jacobi迭代法工具箱

    function [u,n]=Jacobi(A,b,u0,eps,varargin) %Jacobi.m函数为用于雅可比迭代法求解线性方程组 %A为线性方程组的系数矩阵 %b为线性方程组的常数向量 % ...

  6. 【CSS】【1】让DIV中的文字换行显示

    <div style="white-space:normal;word-break:break-all;word-wrap:break-word;">data</ ...

  7. poj-1061-exgcd

    青蛙的约会 Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 128285   Accepted: 27962 Descript ...

  8. Slony-I同步复制部署

    本次测试环境 IP 10.189.102.118 10.189.100.195 10.189.100.226 PGHOME /usr/local/pgsql /usr/local/pgsql /usr ...

  9. 月日加四位尾数编号生成 VB方式

    <%Private Sub Form_Click()MsgBox "生成两位后缀"ClsFor i = 1 To 99barcod= Format(Right(Year(Da ...

  10. java.sql.SQLException: Parameter index out of range (3 > number of parameters, which is 2).

    java.sql.SQLException: Parameter index out of range (3 > number of parameters, which is 2). java. ...