实现事理
1、先准备一张透明的png图片。
2、对这个图片定义一个 Css样式，添加这几个属性：
background-position: center；背景图片居中
background-size: contain；显示完全背景图片
background-repeat: no-repeat；背景图不重复
3、然后把要显示的图片作为背景图片。
这样图片就不会随着尺寸不同错位显示。展示的时候如果须要显斧正方形图片，只须要制作一个1x1比例的png图片，其余可以根据自己的哀求制作png图片。
升级处理
在展示图片的时候，可能有些小伙伴不喜好把图片放到style样式里面，可能会觉得到看起来怪怪的。
style="background-image: url('/uploads/demo.jpg');
我们想要的可能是这样的展示办法
<img src="/public/empty_200x100.png" data-src="/uploads/demo.jpg" class="imgbg">
这样实在也大略，我们可以借助于 jquery 来实现这个功能。代码如下：
<script type="text/javascript">$(document).ready(function() { $("[class='imgbg']").each(function(index, el) { $(this).css('background-image', 'url(' + $(this).data('src') + ')'); });});</script>
PHP 实现
PHP 实现天生图片也分为二种
1、图片上传的时候，按后台设置的尺寸天生。
2、图片预览的时候，按URL中设置的参数天生。
github地址
https://github.com/zjutsxj/autoCropImage
