纯 CSS 实现高度与宽度成比例的效果

HTML:
<p class="image-container">
  <img src="xxx.png">
</p>

CSS:
p.image-container {
  width: 100%;
  height: 0;
  padding-bottom: 60%;
  overflow: hidden;
}

p.image-container img {
  width: 100%;
}

原出处：
http://jsfiddle.net/luin/3g5AZ/
http://zihua.li/2013/12/keep-height-relevant-to-width-using-css/