Центрирование изображения в бутстрапе

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

<div class="col-lg-10 ccol-lg-offset-1 col-md-12 col-sm-12 ">
    <div class="col-lg-2 col-md-2 col-sm-2 col-xs-12">
        <img src="images/2.png" class="img-responsive" />
        <p class="text-center"><a href="javascript:void(0);">Taj Group</a></p>
    </div>
    <div class="col-lg-2  col-md-2 col-sm-2 col-xs-12">
        <img src="images/2.png" class="img-responsive" />
        <p class="text-center"><a href="javascript:void(0);">Taj Group</a></p>
    </div>
    <div class="col-lg-2  col-md-2 col-sm-2 col-xs-12">
        <img src="images/2.png" class="img-responsive" />
        <p class="text-center"><a href="javascript:void(0);">Taj Group</a></p>
    </div>
    <div class="col-lg-2  col-md-2 col-sm-2 col-xs-12">
        <img src="images/2.png" class="img-responsive" />
        <p class="text-center"><a href="javascript:void(0);">Taj Group</a></p>
    </div>
    <div class="col-lg-2 col-md-2 col-sm-2 col-xs-12">
        <img src="images/2.png" class="img-responsive" />
        <p class="text-center"><a href="javascript:void(0);">Taj Group</a></p>
    </div>
    <div class="col-lg-2 col-md-2 col-sm-2 col-xs-12">
        <img src="images/2.png" class="img-responsive" />
        <p class="text-center"><a href="javascript:void(0);">Taj Group</a></p>
    </div>

Ответы

Ответ 1

Обновление 2017

Загрузочный файл 2.x

Вы можете создать новый класс CSS, например:

.img-center {margin:0 auto;}

И затем добавьте это к каждому IMG:

 <img src="images/2.png" class="img-responsive img-center">

ИЛИ, просто переопределите .img-responsive, если вы собираетесь центрировать все изображения.

 .img-responsive {margin:0 auto;}

Демо: http://bootply.com/86123

Bootstrap 3.x

EDIT. С выпуском Bootstrap 3.0.1 класс center-block теперь можно использовать без какого-либо дополнительного CSS.

 <img src="images/2.png" class="img-responsive center-block">

Bootstrap 4

В Bootstrap 4 alpha 6 для центрирования изображений можно использовать класс mx-auto (авто-по оси x).

Ответ 2

.img-responsive {
     margin: 0 auto;
 }

вы можете написать, как и выше, код в своем документе, поэтому не нужно добавлять еще один класс в тег изображения.

Ответ 3

Использовать это как решение

Это сработало для меня отлично.

<div align="center">
   <img src="">
</div>