参考链接: http://zihua.li/2013/12/keep-height-relevant-to-width-using-css/

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
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%;
}