Si el navegador del visitant del lloc web no troba cap indicació del disseny de color dels hiperenllaços al codi de la pàgina, fa servir els valors predeterminats. Aquests valors són de color blau per als enllaços passius, vermell per als enllaços actius (sobrevol) i el to de color magenta per als enllaços ja visitats. Aquest esquema de colors no sempre es combina amb l’esquema de colors del disseny de la pàgina, per tant, normalment s’inclou al bloc un bloc de descripcions d’estil d’enllaç.
Instruccions
Pas 1
Creeu un conjunt d’instruccions per al navegador que descrigui els colors de l’enllaç en tres estats. Per exemple, pot tenir aquest aspecte: a: link {color: Red;}
a: visitada {color: Yellow;}
a: hover {color: Orange;} Aquí la "a" al començament de cada línia s'anomena "selector" i especifica l'etiqueta a la qual el navegador ha d'aplicar la descripció d'estil inclosa entre claus. "A" és l'etiqueta d'hiperenllaç. La paraula afegida al selector separat per dos punts es diu "pseudo-classe": el navegador utilitza per determinar a quin estat d'enllaç pertany l'estil de claus. l'enllaç coincideix amb un enllaç normal, ha visitat un enllaç que ja s'ha visitat i passeu el cursor quan el cursor se situa sobre ell. Els colors assignats al paràmetre de color dins de les claus es poden especificar pel nom de la tonalitat del color o pel seu codi hexadecimal.
Pas 2
Si heu d'assignar colors diferents a diferents grups d'enllaços de la pàgina, assigneu a cada grup la seva pròpia designació ("classe") i feu una descripció independent dels estils per a cadascun d'ells. Per exemple, anomeneu un grup LinksRed i l’altre LinksGreen. A continuació, la descripció de l'estil tindrà el següent aspecte: a. LinksRed: link {color: Red;}
a. LinksRed: visitat {color: Yellow;}
a. LinksRed: passeu el cursor {color: Orange;} a. LinksGreen: link {color: Green;}
a. LinksGreen: visitat {color: GreenGreen;}
a. LinksGreen: passeu el cursor {color: Lime;} I a les etiquetes dels enllaços de cada grup, heu d’indicar a quina classe pertanyen. Per exemple: enllaç vermell
Enllaç verd
Pas 3
Aquestes instruccions s’escriuen en CSS (Cascading Style Sheets), de manera que cal col·locar-les dins d’una etiqueta d’estil que les separi d’altres instruccions del codi font de la pàgina, escrites en HTML (HyperText Markup Language)):
a. LinksRed: enllaç {color: Red;}
a. LinksRed: visitat {color: Yellow;}
a. LinksRed: passeu el cursor {color: Orange;} a. LinksGreen: link {color: Green;}
a. LinksGreen: visitat {color: GreenGreen;}
a. LinksGreen: passeu el cursor {color: Lime;}
Pas 4
Col·loqueu el bloc de descripció de l'estil d'enllaç preparat a la part de la capçalera del codi font de la pàgina: està delimitat per les etiquetes i.
