如何将图像置于旋转木马中心

如何在旋转木马中居图像? 我使用bootstrap教程中的代码尝试了bootstrap 3 carousel:

   

对于宽屏幕,旋转木马图像左对齐,图像右侧有空白空间。 如何使旋转木马更好? 是否可以居中图像或其他解决方案?

你有两个选择

  1. 如果你想让图像占用整个旋转木马

    img {宽度:100%; 身高:自动; }

  2. 如果你不想让图像伸展100%,那么设置你想要的宽度(或者不要,只指定边距)和自动边距:

    img {宽度:50%; 保证金:自动; }

如果你真的想要关注twitter bootstrap synthax,你应该使用文档中解释的center-block类。

链接到文档

链接到bootply

代码摘录

 xxx 

尝试添加此CSS以将图像与中心对齐:

 .carousel-inner .item a img { margin: auto; } 
Interesting Posts