Bordes de imágenes

eragas · #1 (**permalink**) 21/07/2010, 06:41

Estimados, encontré que se pueden hacer bordes con CSS.

Quisiera saber si alguien me puede ayudar a que mis imágenes queden algó como en la imagen:

Si alguien sabe un estilo parecido sería genial, ya que quisiera que mis imágenes tuvieran ese borde.

Encontré este link:
http://net.tutsplus.com/tutorials/ht...th-simple-css/

Mil gracias,

TuWebBook · #2 (**permalink**) 21/07/2010, 07:07

Creo que se hace dando px al "margin" de las imágenes.

eragas · #3 (**permalink**) 21/07/2010, 07:38

Please, si me pueden ilustrar aún más pero a nivel de código. Seríal genial.

Gracias!!!

eragas · #4 (**permalink**) 21/07/2010, 09:10

Estimados, a lo mejor podría quedar algo así. Es posible con el CSS, somo se hace?

Se aprecia que la imagen está al medio y tiene como un fondo gris y un borde más oscure. Genial

Gracias,

registrorma · #5 (**permalink**) 21/07/2010, 09:16

Código HTML:

Ver original<img src="tu/imagen" style="border:10px;">

Donde dice 10px tienes que poner el numero de pixeles que quieres de grosor.

Garot · #6 (**permalink**) 21/07/2010, 09:46

Para hacer bordes dobles aplicando estas reglas a las imagenes tiene que funcionar:

Código CSS:

Ver originalborder-style:double; 
padding:5px; 
background:#BCBEC0;

Ahi con "padding" podes regular la separacion de los bordes respecto de la imagen y con "background" pones el color de fondo que quieras.

Espero que te sirva.

Saludos

eragas · #7 (**permalink**) 21/07/2010, 09:54

Genial @Garot, y por favor como se inserta en este caso ya dentro del <body>, cuak sería el código suponiendo que tengo el estilo en una hoja externa de CSS.

Es decir como se inserta la imagen.

Gracias,

Garot · #8 (**permalink**) 21/07/2010, 10:07

Si en el html tenes las imagenes y queres darle el estilo mediante una hoja externa podes poner asi dentro del archivo CSS:

Código CSS:

Ver originalimg {  
      border-style:double;
      padding:5px;
      background:#BCBEC0;
}

pero ojo que ahi te lo va a aplicar a todas las imagenes del html.
No se adentro de que DIV tenes las imagenes pero podes especificar a que imagenes queres aplicarle el estilo, por ej:

Código CSS:

Ver original#nombredeldiv img {  
      border-style:double;
      padding:5px;
      background:#BCBEC0;
}

Ahi se aplicaria a todas las imagenes que esten dentro del DIV "nombredeldiv".

Saludos