莉丝前端

在H5下，很多时候需要对某些DIV进行高度或者宽度的设置。这些高度是相对屏幕的。

如果div宽度相对屏幕宽度或者div高度相对屏幕高度的百分比。这些都很好解决

但是如果div宽度相对屏幕高度或者div高度相对屏幕宽度要怎么解决

1、JS：

最简单的方法，但是弊端也很明显，存在重绘的问题。

2、vw&vh

CSS3中引入这2个单位。

vw-------相对屏幕宽度

vh-------相对屏幕高度

范例：

<style>
.demo1{
    height:10vw;
    width:10vh;
    line-height:10vw;
    background:#f00;
}
.demo2{
    height:100vw;
    width:30vh;
    background:#ff0;
    line-height:100vw;
}
</style>
<div class="demo1">demo1</div>
<div class="demo2">demo2</div>