Твиттер Bootstrap 2.3.2 изображение в нежидкой сетке

Question

Я строю шаблон с начальной загрузкой 2.3.2, и я хочу иметь изображения, которые имеют определенные размеры в соответствии с сеткой. (Я не использую жидкостную сетку, однако я использую адаптивные функции).

Я ожидаю, что изображение, которое содержится, например, в span4 div будет соответственно уменьшаться, даже если он имеет большее разрешение, но вместо этого он отображается с реальным размером пикселя. Есть ли способ уменьшить изображение в соответствии с размером div? Или я должен применить явную ширину в CSS?

Я знаю, что в простом CSS я могу добиться того, что хочу, таким образом: как мне автоматически изменить размер изображения, чтобы он соответствовал контейнеру div, но мне было интересно, есть ли в Bootstrap специальный класс для этого.

Вот мой код:

<div class="container">  
            <div class="row">
                <div class="span12">
                    <div class="row">
                        <div class="span4">
                            <img class="img-polaroid" src="public/images/h1.jpg" alt="" />
                        </div>
                        <div class="span8">
                            <img class="img-polaroid" src="public/images/h2.jpg" />
                        </div>
                    </div>
                </div>
            </div>
</div>

Answer 1

Если вы используете Bootstrap 2, то лучше всего делать то, что говорит вопрос, на который вы ссылаетесь, и добавлять определенное правило в свой CSS, поскольку ветка 2.x не имеет ничего особенного для адаптивных изображений.

Другой вариант, который стоит рассмотреть, - это перейти на Bootstrap 3, в котором есть помощник с отзывчивым изображением. Это так же просто, как добавление .img-responsive к любому изображению. См. Документы 3.x для получения дополнительной информации по адресу: http://getbootstrap.com/css/.