How to achieve the effect of "stack" using CSS?

Question

I would like to add a class to the images that will add a border that will make them look like a stack of photos. Does anyone know how to do this?

Clarifications: ideally, something like the stack shown here , but it should not be interactive and should work for only one photo, I also do not mind using javascript if necessary (jQuery would be preferable, though).

Answer 1

The effect of depth is likely to be a shadow tag . Do you also need to rotate your photos for the "dirty photography" effect, or are you looking for a "neatly sophisticated" look?

, " " :

• "" (
• (
• . , , - Jquery plugin, .

Answer 2

IMG- DIV ( divs ). CSS, , DIV , . , .

Answer 3

CSS3 , border-image.

Answer 4

div , 2 .

<div class="img-shadow"><img ...></div>

.img-shadow {style.css (line 456)
background-color:#505050;
float:left;
margin:5px 0 0 0;
}
.img-shadow img {style.css (line 461)
background-color:#FFFFFF;
border:3px solid #000000;
display:block;
margin:-8px 8px 8px -8px;
padding:10px;
position:relative;
}

in the .img-shadow class, define a graphic for your background that is large enough for your images and looks like a stack of photos. The above pretends that the photo casts a shadow.

Answer 5

Below is my recommendation, which has simple and simple CSS that provides a perfect stack of photos.

http://dabblet.com/gist/2023431