Borde de las imágenes
El lenguaje HTML permite recuadrar a las imágenes que incluyamos en nuestras páginas con un borde de grosor variable. En general este borde es invisible, a nos ser que especifiquemos lo contrario. Sin embargo cuando vimos las imágenes enlace observamos que alrededor de estas imágenes aparecía un borde azul indicando que se podía pulsar sobre ellas. Como enseguida veremos que es posible conseguir que las imágenes normales SI tengan ese borde y que las imágenes enlace no lo tengan o que sea de otro grosor distinto al que aparece por defecto.
La manera de controlar el borde es usar un nuevo atributo, BORDER, que debe ser usado dentro de la etiqueta IMG. Este atributo toma como valor el número de pixeles que debe tener el borde. Si nuestro objetivo no es añadir un borde sino quitarlo, o asegurarnos que no lo tendrá debemos usar BORDER=0. De esta forma podremos conseguir que desaparezca el borde en las imágenes enlace. En la figura 5.20 podemos ver tres ejemplos de imágenes enlace:
Figura 5.20. Las imágenes enlace tienen un borde azul por defecto, pero podemos quitarlo o variar su grosor usando el atributo BORDER de la etiqueta IMG.
En el primero de ellos no hemos usado el atributo BORDER:
En el segundo lo hemos usado dándole el valor cero para eliminar el borde:
Y en el tercero le hemos dado el valor 10:
El uso de BORDER=0 es especialmente útil en los llamados iconos de navegación. Estos iconos son imágenes enlace que incluimos en las páginas y que suelen tener la apariencia de botones, flechas y similares y cuya función es ayudar al visitante a navegar por nuestra página. En la figura 5.21 podemos ver varios de estos iconos. En todos estos casos la aparición de un borde alrededor de la imagen perjudicaría su apariencia.
Figura 5.21. Las imágenes enlace se usan a menudo para crear iconos de navegación como los que aquí vemos. En estos casos es conveniente quitar el borde usando BORDER=0.
Sin embargo no debe parecer que el atributo BORDER sólo tiene utilidad en las imágenes enlace, ya que podemos usarlo con todo tipo de imágenes y en ocasiones nos ayuda a crear interesantes efectos. En la figura 5.22 podemos ver ejemplos de imágenes normales sin borde o con borde de distinto grosor.
Figura 5.22. Las imágenes normales también pueden tener un borde de grosor variable, aunque en este caso el color no es azul, sino negro.
En estos ejemplos observamos que si las imágenes no son links el borde es negro en vez de azul. No existe por ahora ningún medio de elegir el color del borde.
Pero además de poder añadir un borde a las imágenes, el HTMLnos permite realizar alguna otra modificación en la apariencia de las imágenes más importante aún, como puede ser modificar su tamaño. De esta forma podremos usar una misma imagen varias veces y con diferentes tamaños en una página Web sin tener crear un archivo GIF o JPG diferente para cada una.
Fuente: Copyright Jorge Ferrer, Rodrigo Garcia y Victor García, licencia Documentación Libre GNU, Versión 1.1
