在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>