Od vynálezu hypertextového značkovacieho jazyka, HTML, sa koncepcie usporiadania a usporiadania webových dokumentov dramaticky zmenili. Vďaka takmer úplnej podpore populárnych prehľadávačov pre kaskádové štandardy šablón štýlov CSS a CSS2 je možné ovplyvniť takmer akýkoľvek aspekt vizuálnej prezentácie dokumentu. Napríklad môžete vytvoriť farebné pozadie odkazu, vyplnené nejakým obrázkom, ktoré sa tiež môže meniť v závislosti od akcií používateľa.
Nevyhnutné
- - schopnosť upravovať text dokumentu alebo text šablón štýlov dokumentu;
- - textový editor, ktorý umožňuje uložiť dokument v pôvodnom kódovaní.
Inštrukcie
Krok 1
Vytvorte pozadie odkazu rovnomerne vyplnené náhodnou farbou pridaním informácií o vloženom štýle k prvku A. Pridajte štýl k atribútom prvku A zodpovedajúcim odkazu, ktorého pozadie chcete zmeniť. V obsahu atribútu style umiestnite vlastnosť CSS farby pozadia s danou hodnotou, ktorá je správnym identifikátorom farby pozadia. Môže to napríklad vyzerať takto:
text odkazu
Krok 2
Definujte pozadie odkazu v externej alebo vloženej šablóne štýlov v dokumente. V príslušnej šablóne štýlov pridajte sadu pravidiel, ktoré sú riešené selektorom prijateľnej úrovne špecifickosti. V sade pravidiel zadajte vlastnosť farba pozadia rovnakým spôsobom ako v predchádzajúcom kroku. Vyberte špecifickosť selektora na základe kaskádových pravidiel CSS2 a požadovaného rozsahu. Takže ak potrebujete nastaviť farbu iba jedného odkazu, má zmysel použiť selektor ID, ak existuje niekoľko takýchto odkazov, je lepšie použiť selektor atribútov na základe hodnoty triedy.
Napríklad na nastavenie zeleného pozadia pre konkrétny odkaz v dokumente môžete do šablóny štýlov pridať sadu pravidiel:
# ID_GREEN
{
farba pozadia: # 00FF00;
}
Mali by ste tiež nastaviť atribút ID prvku A zodpovedajúci požadovanému odkazu na ID_GREEN:
text odkazu
Krok 3
Vyplňte pozadie odkazu obrázkom. Postupujte podľa metód popísaných v krokoch jeden a dva, ale namiesto vlastnosti CSS farba pozadia použite obrázok pozadia. Napríklad:
text odkazu
V prípade potreby pridajte do sady pravidiel CSS vlastnosť opakovania pozadia, ktorá definuje možnosti duplikovania obrazu na pozadí horizontálne a vertikálne.
Krok 4
Pozadie odkazu urobte, keď na neho umiestnite kurzor myši alebo keď sa presunie zaostrenie. Pridajte sady pravidiel do externej alebo vloženej šablóny štýlov dokumentu, ktoré definujú pozadie odkazu alebo skupiny odkazov v rôznych stavoch. Používajte selektory ID a atribútov v spojení s dynamickými pseudotriedami: hover,: active a: focus. Napríklad aby pozadie odkazu s hodnotou atribútu ID ID_DYNAMIC_BACKGROUND bolo červené v neaktívnom stave a zelené v stave, že je pod kurzorom myši, musia byť do šablóny štýlov pridané nasledujúce sady pravidiel:
A # ID_DYNAMIC_BACKGROUND
{
farba pozadia: # FF0000;
}
A # ID_DYNAMIC_BACKGROUND: umiestnite kurzor myši
{
farba pozadia: # 00FF00;
}
To isté môžete urobiť, aby ste vytvorili pozadie s dynamicky sa meniacim obrázkom.
