使用bootstrap自动拉伸图像

Question

我有一个1905像素宽的图像,我希望自动调整大小以适应引导程序读取的宽度.这似乎不起作用:

<div class="body container-fluid">
    <div class="row">
        <div class="col-md-12 col-lg-12 col-sm-12">
            <img src="~/Content/Images/Temp/WP_20140326_001.jpg" />
        </div>
    </div>
</div>

我必须使用CSS宽度吗？谢谢 !

Answer 1

Bootstrap有一个帮助类来帮助图像响应:

.img-responsive

其中,与Ken的回答几乎相同:

.img-responsive,
.thumbnail > img,
.thumbnail a > img,
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  display: block;
  max-width: 100%;
  height: auto;
}

Bootstrap Github .img-responsive

Answer 2

.row > div > img { width: 100%; display: block; }