Protams, eksistē, un noteikti plašāk izplatīts variants, izvēlnes aktīvo
saiti (to, kura norāda uz lappusi, kurā lietotājs atrodas pašlaik)
iezīmēt ar JavaScript koda palīdzību. Tomēr eksistē iespēja šo pašu
panākt tikai un vienīgi ar stilu palīdzību. Par to - šajā aprakstā.
Aktīvās saites iezīmēšana ar CSS palīdzību pamatojas uz to, ka KATRAI lappusei, uz kuru norāda iezīmējamā saite, body elementam piešķiram unikālu identifikātoru, kas to atšķirs no citām lappusēm.
Piemērs sākumlapai :
<body id="sakums">
Piemēra pēc pieņemsim, ka mums ir 3 lappuses (lai saprastu principu, pietiks) - "Sākums" , "Kontakti" , "Par mani".
Katras šīs lappuses body tegam piešķiram identifikātoru pēs augstāk minētā piemēra.
Rakstām šādu stila bloku :
<style>
#sakums .sakums, #kontakti .kontakti, #parmani .parmani
{
color:#ff0000;
}
</style>
Un šāda piemēra pēc izskatīsies mūsu izvēlne :
Aktīvās saites iezīmēšana ar CSS palīdzību pamatojas uz to, ka KATRAI lappusei, uz kuru norāda iezīmējamā saite, body elementam piešķiram unikālu identifikātoru, kas to atšķirs no citām lappusēm.
Piemērs sākumlapai :
<body id="sakums">
Piemēra pēc pieņemsim, ka mums ir 3 lappuses (lai saprastu principu, pietiks) - "Sākums" , "Kontakti" , "Par mani".
Katras šīs lappuses body tegam piešķiram identifikātoru pēs augstāk minētā piemēra.
Rakstām šādu stila bloku :
<style>
#sakums .sakums, #kontakti .kontakti, #parmani .parmani
{
color:#ff0000;
}
</style>
Un šāda piemēra pēc izskatīsies mūsu izvēlne :
<ul>Tātad - saite ar nosaukumu "Kontakti" tiks iekrāsota sarkanā (#ff0000) krāsā tikai tad, ja lappuses, kura tobrīd atvērta, identifikātors ir #kontakti (#kontakti .kontakti)
<li><a href="#" class="sakums">Sākums</a></li>
<li><a href="#" class="kontakti">Kontakti</a></li>
<li><a href="#" class="parmani">Par mani</a></li>
</ul>