Distintos bordes de imagen con CSS

Mediante CSS podemos crear bordes de imágenes personalizados. Para ello utilizaremos una imagen de fondo y mediante la propiedad 'padding' establecemos el grosor del borde de la imagen.

Todo ello irá en una clase CSS que asociaremos a las imágenes que deseemos que tengan marco. Variando la imagen de fondo y el valor de 'padding' podemos obtener efectos muy diversos. Para el siguiente ejemplo he utilizado esta imagen de fondo:



CSS:

1. <style type="text/css">
2. .Imagen_Dot{
3. padding:6px;
4. background:url(dotted.gif) repeat;
5. }
6. </style>



HTML:

1. <p align="center" >
2. <img src="imagen.jpg" width="200" height="133" class="Imagen_Dot">
3. </p>


Autor: Web Intenta
http://www.webintenta.com/distintos-bordes-de-imagen-con-css.html

Usuarios que han visto este tema también han visto...

- wrapScroll: Desplazamiento automático de DIV’s con CSS
- Cómo utilizar el Opacity con CSS
- Redondear esquinas de una tabla
- Texto 3D con CSS
- ToolTip avanzado con CSS

- Versión imprimible de este documento
- Enviar por e-mail este documento