这个地方主要是通过父级元素的两个属性
-webkit-box-align: center;
-webkit-box-pack: center;

通过使用 box-align and box-pack 属性，居中 div 框的子元素。目前没有浏览器支持 box-align 属性。
Firefox 支持替代的 -moz-box-align 属性。
Safari、Opera 以及 Chrome 支持替代的 -webkit-box-align 属性。

Chrome 元素审核看看

点击进去，查看图片详情，利用css对图片进行定位

PhotoSwipe 这个插件完全满足你的需求，开源项目，官网可能需要翻墙。
项目地址： https://github.com/dimsemenov/PhotoSwipe
官网： http://photoswipe.com/

请大家鉴定！！

PS：今天用这个SF竟然发现支持markdown，厉害