Sunday, December 10, 2006

Cómo quitar los bordes de las imágenes


Qué incómodo es ese recuadro que aparece por defecto enmarcando nuestra límpida e impoluta ilustración o fotografía, ¿verdad? Tamaña aberración, símbolo del intrusismo del programador en la obra del artista, debe ser eliminada sin premura. Nada más fácil:

- Busque en la plantilla del blog de usted, a eso de la mitad del recorrido del scroll, este código:

.post img {
padding:4px;
border:1px solid #ddd;
}


En esta pequeña muestra de literatura contemporánea, podemos determinar que padding es la cantidad de espacio que habrá entre nuestra imagen y el borde. Tenga en cuenta que aunque el borde sea invisible, el espacio seguirá existiendo: puede ser útil para separar la imagen del texto o de cualquier otro elemento que la rodee. Si se ve con ánimos, experimente con diversas medidas.

Encontramos también en tan intrigante código la propiedad border, la cual tiene tres valores:

- 1px indica el tamaño en píxeles de dicho borde. Para eliminarlo, ponga usted 0px (cero píxeles);

- solid se refiere al aspecto del borde. Los puede encontrar punteados, rayados, dobles... pero recuerde que si no los ha visto antes en ningún otro espacio web, por algo será.

- Finalmente, #ddd indica el color del borde en valor hexadecimal. Si usted conoce tal sistema y/o cómo descifrarlo, experimente. En caso contrario, pase usted por aquí.

Si por cualquier circunstancia la precedente verborrea le ha distraido del asunto que pretendía usted resolver, que era eliminar el incómodo bordecito, aquí tiene un resumen del resultado final:

.post img {
padding:4px;
border:0px;
}


Suerte y hasta la próxima lección.