FONDOS Y COLORES
7.FONDOS Y COLORES
Se puede cambiar el fondo de dos maneras distintas:
1. Con un color uniforme
2. Con una
imagen
1. Fondos con un color uniforme
Se consigue
añadiendo el comando
BGCOLOR a la etiqueta <BODY> (situada al principio del documento), de la siguiente manera:
<BODY
BGCOLOR="#XXYYZZ">
XX Es un número indicativo de la cantidad
de color rojo YY Es un número indicativo de la cantidad de color verde ZZ Es un número indicativo de la cantidad
de color azul
Estos números están en
numeración hexadecimal. Esta numeración se caracteriza por tener 16 dígitos (en
lugar de los diez de la numeración decimal habitual). Estos dígitos son:
0 1 2 3 4 5 6 7 8 9 A B C
D E
F (A=10, B=11, C=12, D=13, E=14, F=15)
Es decir, que en nuestro caso, el número menor es el
00 y el mayor el FF (=255). Así, por
ejemplo, el color rojo es el
#FF0000,
porque tiene el máximo de rojo y cero de los otros dos colores. Los colores más
simples son:
|
#FF0000 Rojo
|
#FFFFFF
|
Blanco
|
#FF00FF
|
Magenta
|
|
#00FF00 Verde
|
#000000
|
Negro
|
#00FFFF
|
Celeste
|
|
#0000FF Azul
|
#FFFF00
|
Amarillo
|
#CCCCCC
|
Gris
|
Para hacer un color más oscuro,
hay que reducir
el número de su componente, dejando los otros dos invariables. Así, el rojo #FF0000 se puede hacer más oscuro con #AA0000, o aún más oscuro
con #550000.
Para hacer
que un color tenga un tono más suave (más
pastel), se deben
variar los otros
dos colores haciéndolos más claros (número más alto), en una cantidad
igual. Así, podemos
convertir el rojo en rosa con #FF7070.
Colores
del texto y de los enlaces
Si no variasen los
colores habituales del
texto y de los enlaces
(negro y azul,
respectivamente), podría ocurrir
que su lectu- ra contra un fondo
oscuro fuese dificultosa o imposible, si el fondo
fuese precisamente negro o azul.
Para evitar
esto, podemos escoger
los colores del texto y de los enlaces, añadiendo
a la etiqueta (si se desea) los siguientes comandos:
|
Los códigos
de los colores son los mismos que los que se han visto anteriormente. La etiqueta, con todas sus posibilidades, sería:
<BODY BGCOLOR="#XXYYZZ"
TEXT="#XXYYZZ" LINK="#XXYYZZ" VLINK="#XXYYZZ" ALINK="#XXYYZZ">
El comando
TEXT explicado anteriormente (que va englobado dentro de la etiqueta <BODY>) cambia el color de la tota- lidad del texto de la página.
Tanto el Netscape
Navigator 2, como el Microsoft Explorer soportan una etiqueta de color de la
fuente con la que se puede cambiar sólo una parte del texto:
<FONT COLOR="#XXYYZZ"> Este texto es de color XXYYZZ </FONT>
2. Fondos con una imagen
El fondo de una página puede
ser también una imagen,
ya sea en formato
GIF o JPG. Esta imagen se repite
por toda la página,
como un mosaico. La estructura de la etiqueta
puede ser:
<BODY BACKGROUND="imagen.gif">
<BODY BACKGROUND="imagen.jpg">
No todos los navegadores soportan este
formato.
Se puede
añadir también a esta etiqueta todos los comandos para cambiar los colores del texto y de los enlaces, vistos ante- riormente. Esto es imprescindible a veces para conseguir que el texto sea legible,
en contraste con el color o imagen
de fondo.
Hay que
prever la posibilidad de que quien
acceda a nuestra
página haya deshabilitado la carga automática de imágenes, en cuyo caso tampoco
cargaría la imagen
que sirve como fondo y sólo vería
el fondo estándar.
Esto podría ser muy perju- dicial si hemos escogido
unos colores para el texto
y los enlaces que no contrastan bien con ese fondo. La solución
a este problema es poner dentro
de la etiqueta <BODY>
los dos comandos BACKGROUND y BGCOLOR (en este
orden), tenien-
do cuidado en escoger un color uniforme
de fondo parecido
al de la imagen.
Por ejemplo,
supongamos que queremos poner como
fondo la imagen nubes.jpg. Escogemos entonces
un color de fondo azul claro,
#CCFFFF. La etiqueta quedaría así:
<BODY BACKGROUND="nubes.jpg"
BGCOLOR="#CCFFFF">
Esto tiene
la ventaja adicional de que, incluso
aunque no se deshabilite la carga automática de imágenes, al cargar la pági-
na, lo primero que se ve es ese fondo
de color uniforme, que luego es reemplazado por el de la imagen.