Images

v3.x

Images support and enhance the meaning of textual content on the page.

BBootstrap 3.x | Images


| Find Image

Add Sample Image (400px2)

Example | Image of Lilya Brik

 Select Icon | Default ( )

Image of Lilya Brik

Rodchenko's famous Lilya Brik

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi eveniet eius dolorum rem perferendis nemo mollitia id quis sed atque sunt, tenetur dolorem ut neque, enim adipisci cumque omnis sequi! Lorem ipsum dolor sit amet, consectetur adipisicing elit. Excepturi incidunt nulla enim praesentium exercitationem cumque optio, labore ullam, ad eligendi nisi, aut sequi facilis quisquam adipisci quasi. Magnam, deserunt, alias!

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloribus amet dolorum nesciunt quod aperiam dolor.


<div class="row">
	<div class="col-sm-6">
		<div class="thumbnail">
			<img class="img img-responsive" src="https://libapps.s3.amazonaws.com/accounts/38465/images/russian-constructivism-art_1-b.jpg" alt="Image of Lilya Brik">
			<p class="push-down-1 text-left">
				<i class="fa fa-fw fa-camera-retro" aria-hidden="true"></i>
				Rodchenko's famous photo of Lilya Brik
			</p>
		</div>
	</div>
	<div class="col-sm-6">
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi eveniet eius dolorum rem perferendis nemo mollitia id quis sed atque sunt, tenetur dolorem ut neque, enim adipisci cumque omnis sequi! Lorem ipsum dolor sit amet, consectetur adipisicing elit. Excepturi incidunt nulla enim praesentium exercitationem cumque optio, labore ullam, ad eligendi nisi, aut sequi facilis quisquam adipisci quasi. Magnam, deserunt, alias!</p>
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Doloribus amet dolorum nesciunt quod aperiam.</p>
	</div>
</div>

Custom CSS

Custom CSS is required for adding a margin-right and margin-bottom when floating images to the right or left.

View all custom Bootstrapr.io CSS
.bsr-right-margin {
   margin-right: 1rem;
   margin-bottom: 1rem;
}

.bsr-left-margin {
   margin-left: 1rem;
   margin-bottom: 1rem;
}