Images
Cuctomizations to make plain images less boringImage rounded
<img class="img-rounded" src="/img/app/color-bars.png" alt="Color Bars">
Image circle
<img class="img-circle" src="/img/app/color-bars.png" alt="Color Bars">Image thumbnail
<img class="img-thumbnail" src="/img/app/color-bars.png" alt="Color Bars">Image responsive
<img class="img-responsive m-b" src="/img/app/icons/android-icon-512x512.png" alt="Kate Template">
Image responsive
<img class="img-responsive m-b" src="/img/kate-logo/kate-logo.png" alt="Kate Template Logo">
Image thumbs
<div class="row">
<div class="col-xs-12 col-sm-6 col-md-3 m-b-md">
<img class="img-responsive m-b" src="/img/idea/a.jpg" alt="image thumb 1">
<p class="content">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elementum quis dolor vehicula suscipit. Ut interdum et arcu non hustensaft. Nullam nec volutpat felis, ac convallis tortor</p>
</div>
<div class="col-xs-12 col-sm-6 col-md-3 m-b-md">
<img class="img-responsive m-b" src="/img/idea/b.jpg" alt="image thumb 2">
<p class="content">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elementum quis dolor vehicula suscipit. Ut interdum et arcu non hustensaft. Nullam nec volutpat felis, ac convallis tortor</p>
</div>
<div class="col-xs-12 col-sm-6 col-md-3 m-b-md">
<img class="img-responsive m-b" src="/img/idea/c.jpg" alt="image thumb 3">
<p class="content">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elementum quis dolor vehicula suscipit. Ut interdum et arcu non hustensaft. Nullam nec volutpat felis, ac convallis tortor</p>
</div>
<div class="col-xs-12 col-sm-6 col-md-3 m-b-md">
<img class="img-responsive m-b" src="/img/idea/d.jpg" alt="image thumb 4">
<p class="content">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elementum quis dolor vehicula suscipit. Ut interdum et arcu non hustensaft. Nullam nec volutpat felis, ac convallis tortor</p>
</div>
</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elementum quis dolor vehicula suscipit. Ut interdum et arcu non hustensaft. Nullam nec volutpat felis, ac convallis tortor
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elementum quis dolor vehicula suscipit. Ut interdum et arcu non hustensaft. Nullam nec volutpat felis, ac convallis tortor
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elementum quis dolor vehicula suscipit. Ut interdum et arcu non hustensaft. Nullam nec volutpat felis, ac convallis tortor
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec elementum quis dolor vehicula suscipit. Ut interdum et arcu non hustensaft. Nullam nec volutpat felis, ac convallis tortor
Bootstrap thumbnails
Default
<div class="row">
<div class="col-xs-6 col-md-3">
<a class="thumbnail" href="#"><img alt="thumbnail" src="/img/portfolio/small/1.jpg"></a>
</div>
<div class="col-xs-6 col-md-3">
<a class="thumbnail" href="#"><img alt="thumbnail" src="/img/portfolio/small/2.jpg"></a>
</div>
<div class="col-xs-6 col-md-3">
<a class="thumbnail" href="#"><img alt="thumbnail" src="/img/portfolio/small/3.jpg"></a>
</div>
<div class="col-xs-6 col-md-3">
<a class="thumbnail" href="#"><img alt="thumbnail" src="/img/portfolio/small/4.jpg"></a>
</div>
</div>
Custom content
<div class="row">
<div class="col-sm-6 col-md-4">
<div class="thumbnail">
<img alt="thumbnail" src="/img/portfolio/small/1.jpg">
<div class="caption">
<h3>Thumbnail label</h3>
<p class="content">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<p><a class="btn btn-primary" href="#" role="button">Button</a> <a class="btn btn-default" href="#" role="button">Button</a></p>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4">
<div class="thumbnail">
<img alt="thumbnail" src="/img/portfolio/small/2.jpg">
<div class="caption">
<h3>Thumbnail label</h3>
<p class="content">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<p><a class="btn btn-primary" href="#" role="button">Button</a> <a class="btn btn-default" href="#" role="button">Button</a></p>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4">
<div class="thumbnail">
<img alt="thumbnail" src="/img/portfolio/small/3.jpg">
<div class="caption">
<h3>Thumbnail label</h3>
<p class="content">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<p><a class="btn btn-primary" href="#" role="button">Button</a> <a class="btn btn-default" href="#" role="button">Button</a></p>
</div>
</div>
</div>
</div>⌃
Copyright © 2019 Kate. All Rights Reserved. 7prism
