2018-09-20 bootstrap 图片轮播 图片居中

当我们使用bootstrap的图片轮播功能，想做一个比较漂亮的页面，如果图片比较小，会发现一个比较尴尬的问题：图片没有居中，如下所示

图片居左边

第一种解决方法，把图片的宽度设计为%100，但是图片会变得非常模糊，代码如下：

图片宽度100%代码

效果如下：

宽度100%效果图

第二种解决方法，结合div和img的属性解决该问题，将div的text-align属性设置为居中，将图片的display属性设置为行内块值。

代码

效果如下：

完美解决

全部代码如下：

html代码
jquery激活代码

备注：2000代表每两秒换一次图片。（本文为了简洁，bootstrap引入代码没有展示，请自行导入相关配置）