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...

- Aplicar los estilos a diferentes dispositivos con CSS
- Imágenes como hitos de las listas
- Cómo usar distintos colores en un select menu con CSS?
- Espacios en blanco con CSS
- Reglas espReglas especiales CSS para Internet explorer 7

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