bootstrap different shaped images - image

Question

I built this mock-up:
I was wondering if this type of gallery is possible to build with bootstrap, I did not start to code yet because I think that it will not work because of the rows.
I would like some second opinions, from people who have worked with bootstrap for longer than me.

Answer 1

I found something that actualy works!! and it's responsive! :D
.poligono, .poligono div {
margin: 0 auto;
transform-origin: 50% 50%;
overflow: hidden;
width: 250px;
height: 250px;
}
.poligono {
transform: rotate(45deg) translateY(10px);
}
.poligono .los1 {
width: 355px;
height: 355px;
transform: rotate(-45deg) translateY(-74px);
}
.poligono .los1 img {
width: 100%;
height: auto;
-moz-transition: all 0.6s;
-webkit-transition: all 0.6s;
transition: all 0.6s;
}
.poligono:hover img {
-moz-transform: scale(1.3);
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
<div id="projects" class="projects">
<div class="container">
<div class="row">
<div class="col-md-offset-9 col-md-3">
<h2>Projects</h2>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="poligono">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
<p class="descricao">Cenas maradas acontecem</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="poligono">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
</div>
</div>
</div>
<div class="col-md-4">
<div class="poligono">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-offset-2 col-md-4">
<div class="poligono">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
</div>
</div>
</div>
<div class="col-md-4">
<div class="poligono">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-4">
<div class="poligono">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
</div>
</div>
</div>
<div class="col-md-4">
<div class="poligono">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
</div>
</div>
</div>
<div class="col-md-4">
<div class="poligono">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-offset-2 col-md-4">
<div class="poligono img-responsive">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
</div>
</div>
</div>
<div class="col-md-4">
<div class="poligono img-responsive">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
</div>
</div>
</div>
</div>
<div class="row margin-bottom">
<div class="col-md-4">
<div class="poligono">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
</div>
</div>
</div>
<div class="col-md-4">
<div class="poligono">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
</div>
</div>
</div>
<div class="col-md-4">
<div class="poligono">
<div class="los1">
<img class=" img-responsive" src="img/project_1.jpg" alt="Projecto 1 UNlogical"/>
</div>
</div>
</div>
</div>
</div>
</div>

Answer 2

If you are asking if there is a default bootstrap for this the answer is no.
But yes this is possible with your own css.
I don't see why not you could not skew the image with something like the following:
img.tilted{
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
-ms-transform: rotate(45deg);
}
If you want this "mask like behaviour" i don't see why you couldn't put all the images on a layer bellow and put a transparent image on the top
Or you can try to css clip it like this http://www.html5rocks.com/en/tutorials/masking/adobe/