[RÉGLÉ] images css article

[jerome2607]

bonjour je souhaiterais bricoler une chose sur mon site
faire un encadre images des photos de mes articles
c est a dire mettre une bordure blanche
je suis sous template creator
je voufrais trouver ou modifier le code css
afin d eviter de rajouter cette marge blanche sous paint comme je l ai fait pour http://willie26.odns.fr/ merci d avance

[pmleconte]

Essayez quelque chose du style :

img {border-radius: 3px;
box-shadow: 0px 1px 3px rgba(0,0,0,0.20);
padding: 3px;
border: 1px solid #ddd;
}

Cela fait un petit cadre, coins arrondis, avec un peu d'ombre

Pascal

[dolmenhir]

Salut,

Il y a plusieurs méthodes pour faire une bordure blanche sur une image.
En voici quelques-unes

1. La classique : bordure blanche de 3px

img {
border:3px solid #fff;
}

2. La classique arrondie : bordure 3 pixels + coins arrondis avec un radius de 5px

img {
border:3px solid #fff;
border-radius:5px;
}

3. La méthode façon photo polaroïd : bordure blanche + liseret gris + bords arrondis

img {
background:#fff;
padding:3px;
border:1px solid #999;
border-radius:5px;
}

4. La méthode polaroïd avec ombre portée sans décalage ("éclairage" de face)

img {
background:#fff;
padding:3px;
border:1px solid #999;
​​​​​​​border-radius:5px;
box-shadow: 0 0 6px #ccc;
}

Pour une ombre portée avec décalage (éclairage latéral ou vertical) on joue avec les valeurs de ces axes X, Y

box-shadow: 2px 2px 6px #ccc;

Y en a d'autres, comme le vrai polaroïd avec un bord blanc plus grand en bas, etc... c'est qu'une question de créativité.

Dol.

[dolmenhir]

Sur ce site, je me suis amusé à incliner les photos, de manière alternée, en utilisant les nth:child(odd) et nth:child(even) et l'attribut transform

https://www.dairyconcept.fr/systemes-salle-de-traite

[jerome2607]

Merci à tous ça marche nickel je vais pouvoir m amuser un peu...