FUENTES
En este apartado veremos la etiqueta <FONT>, tan usada que le hemos dedicado un capítulo completo. Tiene su cierre </FONT>.
Tiene varios atributos, que iremos viendo. Comenzamos con FACE, que es el que va a marcar la fuente que se verá. Esto tiene un problemilla y es que el texto se verá de acuerdo a la fuente marcada en FACE (si no tiene la primera irá a la segunda y así) pero sólo si el ordenador que ve mi página tiene dichas fuentes, si no tiene ninguna cogerá la predeterminada de su máquina.
De este modo lo mejor es no andarse con filigranas y poner varias de las más comunes ya que de nada vale poner una fuente chachi si no la van a ver.
Las fuentes van con su nombre separadas por comas y entrecomilladas. Si una tiene más de un nombre se entrecomilla dentro del entrecomillado; esto en HTML se hace con "...'...'..." (comillas simples dentro de dobles). La predeterminada es la Times New Roman.
Veamos ejemplillos:
|
<BODY>
<FONT FACE="arial, courier, 'times new roman', serif"> Ahora el texto que vemos con dicha fuente </FONT> </BODY> |
|
Ahora el texto que vemos con dicha fuente
|
El siguiente atributo es COLOR, que lleva valores hexadecimales o los admitidos en inglés (red, green, navy, olive,...).
|
<BODY>
<FONT COLOR=red> Esto es rojo </FONT> <FONT COLOR=#00ff00> Y esto es verde </FONT> </BODY> |
|
Esto es rojo
Y esto es verde |
El último atributo es SIZE que determinará el tamaño. Podemos poner un tamaño absoluto (2, 3, 4,...) o relativo (+1, +3, -3,...) de modo que el relativo se refiera al tamaño predeterminado que, si no lo cambiamos con <BASEFONT> (se ve al final) será de 3.
|
<BODY>
<FONT SIZE=+2> Esto es más grande que el normal </FONT> <FONT SIZE=6> Y esto también </FONT> <FONT SIZE=1> Y esto es más pequeño </FONT> </BODY> |
|
Esto es más grande que el normal
Y esto también Y esto es más pequeño |
En Netscape funciona una variante <FONT POINT-SIZE=25> que expresa el tamaño en puntos.
Ahora los mezclamos todos. Observa que los atributos van separados con espacios en blanco, nada más.
|
<BODY>
<FONT FACE="arial" COLOR=#0000ff SIZE=+2> Esto es más grande que el normal, Arial y azul. </FONT> </BODY> |
|
Esto es más grande que el normal, Arial y azul.
|
Y algunas cosillas curiosas que se pueden hacer.
|
<BODY>
<FONT COLOR=red> C <FONT COLOR=blue> L <FONT COLOR=maroon> O <FONT COLOR=pink> R <FONT COLOR=navy> O <FONT COLOR=black> F <FONT COLOR=grey> I <FONT COLOR=yellow> L <FONT COLOR=olive> A </FONT> </BODY> |
|
C L O R O F I L A
|
Y otra jugando con tamaños.
|
<BODY>
<FONT SIZE=+1> C <FONT SIZE=+2> L <FONT SIZE=+3> O <FONT SIZE=+4> R <FONT SIZE=6> O <FONT SIZE=5> F <FONT SIZE=4> I <FONT SIZE=3> L <FONT SIZE=2> A </FONT> </BODY> |
|
C L O R O F I L A
|
Como se ve, vamos sumando 1 al predeterminado (os recuerdo que es 3), de modo que empieza con 4 (3+1), sigue tamaño 5, 6, 7. Si ahora empezamos a disminuir poniendo -1, la letra siguiente tendría tamaño 2 (3, el predeterminado -1), con lo que para que quede bien, al disminuir he puesto valores absolutos de descenso. Bonita chorradita ¡Eh!.
![]()
Lo que vamos a ver ahora es otra etiqueta relacionada con todo esto, es la <BASEFONT>, sin cierre, con el atributo SIZE. Se pone tras la etiqueta <BODY> y hace que todo el documento tenga, como predeterminado, el tamaño ahí especificado.
|
<BODY>
<BASEFONT SIZE=5> Y con esto ya vale. </BODY> |
|
|
De modo que ahora los valores relativos se refieren a 5. Así en el siguiente código, el tamaño será 3.
|
<BODY>
<BASEFONT SIZE=5> <FONT SIZE=-2> Y con esto ya vale. </FONT> </BODY> |
|
|
![]()