Voici l'image à transformer en médaillon. Elle fait 400px sur 400px.
Pour mettre une image en médaillon, il suffit d'ajouter l'URL de l'image à ce code.
Régler ensuite border-radius, puis width et height à la même valeur pour obtenir un cercle et faire en sorte que ces valeurs soient égales ou inférieures à la hauteur et à la largeur de l'image.
Son URL est "http://img.over-blog-kiwi.com/1/30/51/51/20150210/ob_9740cd_2.jpg"
CODE
<style type="text/css">
.roundedImage{
overflow:hidden;
-webkit-border-radius:100px;
-moz-border-radius:100px;
border-radius:400px;
width:400px;
height:400px;
}
</style>
<div class="roundedImage">
<img src="url de l'image" alt="1"/>
</div>
RESULTAT

commentaires