关于display:table-cell

见识浅陋，也许还有更多的是未知，但凡见到我这篇文章，发现不对的地方希望大家能提出，让我成长，致谢！

 最近产品需求变更需要让图片垂直居中，如果只是单纯的垂直居中，可能还好解决。这里的难点有如下几点：

1.图片大小不确定，比例不确定

2.不能拉伸变形，要按照等比例缩放

3. 需要垂直居中

单要居中，水平可text-align：center 或者块级元素 margin:0 auto; 垂直 行内元素可以 vertical-align:middled

但你的margin值需要父元素的高度-自身高度再除以2 除了用js，css貌似完成不了

 于是百度到了display:table-cell这个好东西   父级设置display:table-cell;vertical-align:middle

图片设最大宽高 就可以正常垂直居中了

可是问题也在于此，我们的网站是响应式的

在网页缩小的过程中，图片哪怕是它的父元素 都并没有垂直居中，影响的恐怕的图片的祖先元素的宽度的变化，无法设图片的父元素本身水平居中导致的

我还没有找出解决之法，希望有答案的人给我留言