响应图像居中引导3 [英] Responsive image align center bootstrap 3

问题描述

我用引导3.在平板电脑上显示的产品目录，产品图片看，由于其体积小（500×500）和767像素，在浏览器的宽度难看。我希望把图像在屏幕的中心，但由于某种原因，我不能。谁是会帮助解决这个问题？

I do a catalog using Bootstrap 3. When displayed on tablets, the product images look ugly because of their small size (500x500) and a width of 767 pixels in the browser. I want to put the image in the center of the screen, but for some reason I can not. Who be will help solve the problem?

您可以看到一个活生生的例子这里。

You can see a live example here.

推荐答案

这是一个愉快轻松搞定。因为 .IMG响应从引导已经设置显示：块，您可以使用保证金： 0自动来居中图像：

This is a pleasantly easy fix. Because .img-responsive from Bootstrap already sets display: block, you can use margin: 0 auto to center the image:

.product .img-responsive {
    margin: 0 auto;
}

这篇关于响应图像居中引导3的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！