Se il browser del visitatore del sito Web non trova alcuna indicazione del design del colore dei collegamenti ipertestuali nel codice della pagina, utilizza i valori predefiniti. Questi valori sono blu per i collegamenti passivi, rosso per i collegamenti attivi (al passaggio del mouse) e la tinta magenta per i collegamenti già visitati. Questa combinazione di colori non è sempre combinata con la combinazione di colori del design della pagina, pertanto nel codice è solitamente incluso un blocco di descrizioni dello stile di collegamento.
Istruzioni
Passo 1
Crea una serie di istruzioni per il browser che descriveranno i colori del collegamento in tre stati. Ad esempio, può assomigliare a questo: a: link {color: Red;}
a: visitato {colore: giallo;}
a: hover {color: Orange;} Qui la "a" all'inizio di ogni riga è chiamata "selector" e specifica il tag a cui il browser deve applicare la descrizione dello stile racchiusa tra parentesi graffe. "A" è il tag del collegamento ipertestuale. La parola aggiunta al selettore separata da due punti è chiamata "pseudo-classe", che il browser usa per determinare a quale stato di collegamento appartiene lo stile tra parentesi graffe. link corrisponde a un collegamento normale, ha visitato un collegamento che è già stato visitato e passa con il mouse su un collegamento quando il cursore passa sopra di esso. I colori assegnati al parametro color all'interno delle parentesi graffe possono essere specificati sia dal nome della tonalità di colore che dal suo codice esadecimale.
Passo 2
Se è necessario assegnare colori diversi a diversi gruppi di collegamenti nella pagina, assegnare a ciascun gruppo la propria designazione ("classe") e creare una descrizione separata degli stili per ciascuno di essi. Ad esempio, nominare un gruppo LinksRed e l'altro LinksGreen. Quindi la descrizione dello stile sarà simile a questa: a. LinksRed: link {color: Red;}
a. LinksRed: visitato {color: Yellow;}
a. LinksRed: hover {color: Orange;} a. LinksGreen: link {color: Green;}
a. LinksGreen: visitato {color: DarkGreen;}
a. LinksGreen: hover {color: Lime;} E nei tag dei link di ogni gruppo, devi indicare a quale classe appartengono. Ad esempio: collegamento rosso
Collegamento verde
Passaggio 3
Queste istruzioni sono scritte in CSS (Cascading Style Sheets), quindi devono essere inserite all'interno di un tag di stile che le separi dalle altre istruzioni nel codice sorgente della pagina, scritte in HTML (HyperText Markup Language)):
a. LinksRed: link {color: Red;}
a. LinksRed: visitato {color: Yellow;}
a. LinksRed: hover {color: Orange;} a. LinksGreen: link {color: Green;}
a. LinksGreen: visitato {color: DarkGreen;}
a. LinksGreen: hover {color: Lime;}
Passaggio 4
Posiziona il blocco di descrizione dello stile di collegamento preparato nella parte dell'intestazione del codice sorgente della pagina: è delimitato dai tag e.
