如何设置图像的CSS样式以适应引导程序宽度

Question

如何设置图像的CSS样式,使其可以适应bootstrap 6列可用的全部宽度,并相应地缩放高度

  <div class="col-xs-6">
    <img src="the_image.jpg" class="my_image_style">          
  </div>

谢谢!

Answer 1

你可以使用boostrap img-responsive类.

<div class="row">
  <div class="col-xs-6">
    <img src="http://placehold.it/1000x100" class="img-responsive">
  </div>
</div>

这是一个示例bootply