响应式布局-不同宽高比例的图片处理

在使用响应式布局时我们经常遇到图片大小不一导致排版乱了的情况
eg：使用了float实现的BootStrap3的栅格系统，有不同宽高比例的图片就会乱掉
虽然有处理的方法但都不是很好，比如：

1. 固定图片高度（这就不响应式了啊）
2. 每行包裹一个row（这就每行的个数就得写死了）
3. 用JS控制（这个方法虽然一定好能好使，但感觉有点浪费）

下面列举一些比较好的处理方法：

使用flex（BootStrap4的栅格系统就是用的它）

适合图片比例相差小，改动代码影响不大的情况

使用PS批处理修改图片

适合图片比例相差小，改动代码影响较大的情况

做成瀑布流效果

适合图片比例相差大的情况