Decorar imágenes con diferentes elementos mediante CSS

webdesignerwall-decora-images.jpg

WebDesignerWall nos presenta un nuevo tutorial donde explica una interesante técnica. En esta ocasión se trata de, mediante css y la etiqueta span, colocar diferentes elementos decorativos en una imagen, tales como dar esquinas redondeadas, poner un clip, rasgar los bordes etc. En el tutorial los aplica a una galería de trabajos pero el “truco” es extrapolable para cualquier sitio. Conseguiríamos lo mismo tratando cada imagen por separado, trabajo bastante tedioso. Con este sistema podríamos configurar, por ejemplo, 3 efectos concretos que aplicaríamos a las imágenes que quisiéramos con el consiguiente ahorro de tiempo y resto de beneficios como son mantener la imagen original intacta, flexibilidad etc. El truco funciona en cualquier tipo de imagen con cualquier tamaño y está testeado en FireFox, Opera, Safari e IE.

Enlace: CSS Decorative Gallery