Cum Se Setează Culoarea Linkului

Cuprins:

Cum Se Setează Culoarea Linkului
Cum Se Setează Culoarea Linkului

Video: Cum Se Setează Culoarea Linkului

Video: Cum Se Setează Culoarea Linkului
Video: Unboxing Barbie Descoperă Culoarea 2024, Mai
Anonim

Dacă browserul vizitatorului site-ului web nu găsește nicio indicație a designului culorilor hyperlinkurilor în codul paginii, atunci folosește valorile implicite. Aceste valori sunt albastre pentru linkurile pasive, roșu pentru linkurile active (pe hover) și nuanța de culoare magenta pentru linkurile deja vizitate. Această schemă de culori nu este întotdeauna combinată cu schema de culori a designului paginii, prin urmare, un cod de descrieri ale stilului de legătură este de obicei inclus în cod.

Cum se setează culoarea linkului
Cum se setează culoarea linkului

Instrucțiuni

Pasul 1

Creați un set de instrucțiuni pentru browser care va descrie culorile link-ului în trei stări. De exemplu, poate arăta astfel: a: link {color: Red;}

a: vizitat {color: Yellow;}

a: hover {color: Orange;} Aici „a” de la începutul fiecărei linii se numește „selector” și specifică eticheta căreia browserul ar trebui să-i aplice descrierea stilului cuprinsă între acolade. „A” este eticheta de hyperlink. Cuvântul adăugat selectorului separat prin două puncte se numește „pseudo-clasă” - că browserul îl folosește pentru a determina carei stări de legătură îi aparține stilul în acolade. linkul se potrivește cu un link obișnuit, a vizitat un link care a fost deja vizitat și plasați un link atunci când cursorul se deplasează peste el. Culorile atribuite parametrului de culoare din interiorul acoladelor pot fi specificate fie prin numele nuanței de culoare, fie prin codul său hexazecimal.

Pasul 2

Dacă trebuie să atribuiți diferite culori diferitelor grupuri de link-uri de pe pagină, atunci atribuiți fiecărui grup propria denumire („clasă”) și faceți o descriere separată a stilurilor pentru fiecare dintre ele. De exemplu, denumiți un grup LinksRed și celălalt LinksGreen. Apoi, descrierea stilului va arăta astfel: a. LinksRed: link {color: Red;}

a. LinksRed: vizitat {color: Yellow;}

a. LinksRed: hover {color: Orange;} a. LinksGreen: link {color: Green;}

a. LinksGreen: vizitat {color: DarkGreen;}

a. LinksGreen: hover {color: Lime;} Și în etichetele linkurilor fiecărui grup, trebuie să indicați cărei clase aparțin. De exemplu: link roșu

Legătură verde

Pasul 3

Aceste instrucțiuni sunt scrise în CSS (Cascading Style Sheets), deci trebuie să fie plasate într-o etichetă de stil care le separă de alte instrucțiuni din codul sursă al paginii, scrise în HTML (HyperText Markup Language)):

a. LinksRed: link {color: Red;}

a. LinksRed: vizitat {color: Yellow;}

a. LinksRed: hover {color: Orange;} a. LinksGreen: link {color: Green;}

a. LinksGreen: vizitat {color: DarkGreen;}

a. LinksGreen: hover {color: Lime;}

Pasul 4

Plasați blocul de descriere a stilului de legătură pregătit în partea de antet a codului sursă al paginii - este delimitat de etichetele și.

Recomandat: