77
Utilisation des effets d’arrière‑plan
Vous.pouvez.aussi.créer.un.bel.effet.de.papier.photo.en.donnant.à.l’image.une.bordure.et.un.
remplissage.(voir.Figure 4.18) :
.img-wrapper img {
background-color: #fff;
border: 1px solid #a9a9a9;
padding: 4px;
margin: -5px 5px 5px -5px;
}
Figure 4.18
Le résultat final de
notre simple technique
d’ombre portée.
Cette.technique.fonctionne.pour.la.plupart.des.navigateurs.modernes..Il.faut.cependant.ajouter.
quelques.règles.simples.pour.qu’elle.fonctionne.avec.Internet.Explorer 6 :
.img-wrapper {
background: url(/img/shadow.gif) no-repeat bottom right;
clear: right;
float: left;
position: relative;
}
.img-wrapper img {
background-color: #fff;
border: 1px solid #a9a9a9;
padding: 4px;
display: block;
margin: -5px 5px 5px -5px;
position: relative;
}
L’effet.d’ombre.portée.fonctionne.maintenant.aussi.dans.Internet.Explorer 6..
Ombres portées "à la Clagnut"
Richard.Rutter.(www.clagnut.com).a.proposé.une.méthode.similaire.pour.créer.des.ombres.
portées..Au.lieu.d’utiliser.des.marges.négatives,.il.préfère.un.positionnement.relatif.pour.
décaler.l’image :