Skugga (box-shadow)

CSS-kod:

.image_shadow {
border-radius: 30px;
box-shadow: 5px 10px 10px rgba(0,0,0, 0.5);
}

HTML-kod:

<p>
<img class="image_shadow" src="../bilder/esko_fyr.jpg"
</p>

 

 

En inre skugga (inset) fungerar inte direkt på en bild.
I exemplet är bilden en bakgrundsbild i en tom DIV-box:

CSS-kod:

#image2 {
background-image: url(bilder/esko_fyr.jpg);
width: 400px;
height: 302px;
border-radius: 30px;
box-shadow: inset 5px 5px 5px rgba(255,255,255, 0.7),
inset -5px -5px 5px rgba(0,0,0, 0.5),
5px 5px 5px rgba(0,0,0, 0.5);
}

HTML-kod:

<div id="image2"></div>