移动前端自适应开发过程中，使用背景图片替换img标签时，img标签可以根据屏幕宽度自适应高度，而背景图片却无法适应高度，使用css的内边距（padding）可以解决高度问题，因为垂直方向的padding值，根据宽度的大小来计算的，办法如下；
<style>.wrap{width: 100%;}.banner{width: 100%;max-width: 490px; /**图片的宽度不大于图片实际像素**/height: 0;max-height: 329px;padding-bottom: 67.14%; /**根据图片高宽比计算*/margin: 0 auto;background: url("images/test.jpg") no-repeat center;background-size: cover;}@media only screen and (min-width: 490px) {/**屏幕大于490时，将背景框高度设置为图片高度的实际像素**/.banner{height: 329px;padding-bottom: 0;}}</style><div class="wrap"><!--role属性 aria-label属性增强html的可读性，更语义化--><div role="img" aria-label="banner img" class="banner"></div></div>
