L'atribut Fulls d'estil en cascada (CSS) s'utilitza amb més freqüència per canviar el color dels hiperenllaços a les pàgines web. Les solucions menys funcionals a aquest problema es troben en el llenguatge HTML (HyperText Markup Language - "llenguatge de marcatge hipertext").
És necessari
Coneixements bàsics de llenguatges HTML i CSS
Instruccions
Pas 1
Prepareu un bloc d’estil per als hiperenllaços. En la seva forma més senzilla, podria tenir aquest aspecte: a {color: Green} Aquí "a" s'anomena "selector", que indica que la descripció de l'estil entre parèntesis s'hauria d'aplicar a totes les etiquetes d'enllaç del document. El verd defineix el color de l'enllaç; es tracta d'una definició molt aproximada del color i poques vegades s'utilitza. Molt més sovint, s'afegeix una "pseudo-classe" al selector "a": és una etiqueta que permet especificar l'estil de l'enllaç en tres estats diferents.
Pas 2
Utilitzeu la pseudo-classe de l'enllaç per definir l'estat normal (inactiu) de l'enllaç. Pot semblar així, per exemple: a: link {color: Green}
Pas 3
Utilitzeu el cursor de pseudo-classe per especificar com hauria d'aparèixer l'enllaç al cursor. Per exemple: a: hover {color: Lime}
Pas 4
Utilitzeu la pseudo-classe visitada per descriure l'estil d'un enllaç que ja heu visitat. Per exemple: a: Visit {color: DarkGreen}
Pas 5
Combineu els tres estats en un bloc de descripció d'estil. L'aspecte del codi HTML que conté descripcions d'estils CSS pot, per exemple, ser així:
a: link {color: Green}
a: Visit {color: DarkGreen}
a: hover {color: Lime}
Aquí, les etiquetes d'estil HTML d'obertura i tancament indiquen al navegador on comencen i acaben les descripcions d'estils, i entre elles hi ha una descripció del comportament de l'enllaç en tres estats.
Pas 6
La mostra utilitzada anteriorment només mostra les característiques del color, però es poden incloure altres atributs a la descripció. Per exemple, si el disseny de la pàgina requereix que l'enllaç no estigui subratllat en l'estat normal (inactiu), sinó subratllat quan el cursor es passa el cursor, el codi es pot modificar de la manera següent:
a: link {color: Green; decoració de text: cap;}
a: Visit {color: DarkGreen; decoració de text: cap;}
a: hover {color: Lime; decoració de text: subratllat;}
Pas 7
Si voleu canviar el color d'alguns enllaços de la pàgina i deixar la resta amb la configuració predeterminada, afegiu l'atribut class a l'etiqueta de cada enllaç que es canvia. Per exemple, assigneu un nom a aquesta classe d’enllaços newLinks. A continuació, l'etiqueta d'enllaç pot tenir aquest aspecte: enllaç de text S'ha d'afegir el mateix nom de classe a la descripció de l'estil:
a.newLinks: link {color: Green; decoració de text: cap;}
a.newLinks: visitat {color: DarkGreen; decoració de text: cap;}
a.newLinks: passa el cursor {color: Lime; decoració de text: subratllat;}
Pas 8
Col·loqueu el codi de descripció d'estil preparat a partir dels exemples descrits anteriorment a la capçalera de la pàgina, entre les etiquetes i. Si cal, afegiu un atribut de classe a les etiquetes d'enllaç amb el nom utilitzat a les descripcions d'estil. A continuació, deseu la pàgina modificada i es completarà el procediment per canviar el color dels hiperenllaços.
