Mise en forme des bordures des images


CSS : 3 règles de style et classes sont disponibles

/*cette règle arrondi les coins de l'image*/
.img-rounded {
	-webkit-border-radius:6px;
	-moz-border-radius:6px;
	border-radius:6px
}
/*cette règle ajoute une bordure style polaroid à l'image*/
.img-polaroid {
	padding:4px;
	background-color:#fff;
	border:1px solid #ccc;
	border:1px solid rgba(0,0,0,0.2);
	-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.1);
	-moz-box-shadow:0 1px 3px rgba(0,0,0,0.1);
	box-shadow:0 1px 3px rgba(0,0,0,0.1)
}
/*cette règle arrondi au maximum les coins de l'image de manière à décrire un cercle compris*/
.img-circle {
	-webkit-border-radius:500px;
	-moz-border-radius:500px;
	border-radius:500px
}

HTML

""<img class="img-rounded" src="http://yeswiki.net/files/YesWikiKekako_wikibus_20121228150140_20121228150335.jpg" alt="wikibus" />""

wikibus

""<img class="img-polaroid" src="http://yeswiki.net/files/YesWikiKekako_wikibus_20121228150140_20121228150335.jpg" alt="wikibus" />""

wikibus

""<img class="img-circle" src="http://yeswiki.net/files/YesWikiKekako_wikibus_20121228150140_20121228150335.jpg" alt="wikibus" />""

wikibus