图片响应式
在响应式开发中最烦恼的应该就是图片了，虽然图片设置max-width: 100%;可以让图片宽度占满容器，但是高度就不能自适应了。如果将容器高度限死，那么我们就要使用媒体查询来控制容器的高度，这样才能保证容器宽高成比例。那如何做到图片随容器宽度变化而变化呢？就像下面图片的效果
这里面的4张图片在不同宽度的容器里，图片的宽高比始终保持不变
实现原理
让图片脱离标准文档流，这样就可以设置图片的高度为100%,然后再设置包裹图片的父容器的paddingTop或paddingBottom，这样图片才能有高度并且一直保持这个比例。
