css实现根据元素自适应宽度设定高度

需求描述：
wap页面展现一张banner图片，要求其宽度为页面的宽度（屏幕宽度），高度为宽度的3/5。

css实现：
js实现方式很简单，就不做介绍了；这里我们说下css的实现方式。

因padding是根据viewport的width来计算的，于是想到通过设置padding-bottom跟width达成某种比例关系。经尝试有效，代码如下：

// banner-box为图片容器，设置其height为0，padding-bottom为60%；便可到达宽/高比为5/3。
.banner-box{
	width:100%;
	height:0;
	padding-bottom:60%
}