Enrera
Mòdul 1
Disseny i creació de pàgines web
  Pràctica
1
2
3
4
5
6
7
8
   
Exercicis
Exercicis
 

Font i color de la lletra

Ara afegireu dins el paràgraf alguns atributs del text, com la mida, la font de la lletra i el color.

 

El color del text està indicat per un codi hexadecimal precedit pel caracter # dins l’etiqueta:
<font color=”#numero hexadecimal”> Text amb color </font>

Dins aquesta etiqueta <font> observeu, també, el paràmetre face (tipus de font de lletra) i size (mida).

Desenvolupament de la pràctica
   
Pràctica

Obriu un nou document de text pla amb el bloc de notes del Windows. Tot seguit, seleccioneu el codi que veieu a continuació, copieu-lo i enganxeu-lo al document que acabeu de crear.

 

<html>

<head>

<title>
Proves amb colors i mides de lletra
</title>

</head>

<body>
<p>
<font color="#000000" face="Arial, Helvetica, sans-serif" size="2">
Escrivimaquesta l&iacute;nia de color negre</font>
</p>
<p>
<font face="Arial, Helvetica, sans-serif" size="3" color="#FF0000">
La segona l&iacute;nia de color vermell i d'una mida m&eacute;s gran (3)</font>
</p>
<p>
<font face="Arial, Helvetica, sans-serif" size="4" color="#0000FF">
La tercera de color blau amb una mida encara m&eacute;s gran (4)
</font>
</p>
</body>
</html>

  Observeu que els paràgrafs van seguits de l'etiqueta <font> amb els atributs del text: color, face (tipus de lletra) i size (mida). Per indicar el final d'aquests atributs del text, afegiu la mateixa etiqueta amb la barra davant: </font>.
 

Els codis dels colors utilitzats són:

  • #FFFFFF per al blanc
  • #000000 per al negre
  • #00FF00 per al blau
  • #FF0000 per al vermell

Deseu el contingut amb el nom tercera.htm i visualitzeu el resultat amb el vostre navegdor. El resultat ha de ser com aquest:

 
Color del text
 
Visualització al navegador
   
Atenció !

Naturalment que els programes editors de pàgines web, com ara el Dreamweaver MX 2004, permeten inserir els colors molt fàcilment sense necessitat de saber els codis hexadecimals corresponents, i fer-ho manualment resultaria una feina feixuga innecessària. Per aquest motiu, no s'aprofundirà més sobre aquest aspecte, però, igualment, es creu força útil conèixer a grans trets el secret de l’acoloriment de la web per poder resoldre discordances petites que puguin aparèixer en el futur.

Pensem, també, en la possibilitat d’escollir un color exacte, que tingueu en una fotografia o dibuix, i que vulgueu utilitzar com a fons de pàgina o del text. En aquest cas, podríeu esbrinar el codi hexadecimal d’aquest color amb l’ajut d’un programa editor, com Fireworks MX, i copiar-lo al codi font HTML de la vostra web.

   
  A la pràctica 4, aprendreu a inserir capçaleres i títols.
 
Amunt