CSSBlog ES - /* El mejor recurso para enriquecer tu estilo */

Algunas veces las imágenes con enlace quedan un pequeño borde, explicaremos cómo deshacernos de él o implementarlo de otras maneras.

Para hacerlo tendremos que aplicar esto en nuestro código CSS:

a img { border:none }

Si deseamos que todas las imágenes tengan 1 pixel de borde verde, en vez de lo anterior, indicamos:

img { border:1px solid green}

También podemos aplicarlo a una imagen simple, sería así:

<a href="#"><img.simple style="border 1px solid green" src="imagen.gif" width="100" height="62" alt="Imagen">

Hay distintos tipos de bordes para aplicar a nuestros elementos:

• none
• dotted
• dashed
• solid
• double
• groove
• ridge
• inset
• outset

Si deseamos aplicar un margen a la derecha de nuestra imagen de 3 píxeles, por ejemplo, debería quedar así:

img {
margin-right: 3px;
border: 1px dashed blue; }

En otra entrada para usuarios más avanzados vimos cómo crear efecto de doble borde usando CSS.

¡Eso es todo amigos!

Vía | Pmob