[HTML][CSS] Menu w formie zakładek (active) Opcje

[krzysiekj]

Witam mam menu zrobione w formie zakładek

[HTML] pobierz, plaintext 
<div id="menu2">
<ul>
	<li><a href="index.php?page=1">1</a></li>
	<li><a href="index.php?page=2">2</a></li>
	<li><a href="index.php?page=3">3</a></li>
</ul>
</div>
[HTML] pobierz, plaintext 

[CSS] pobierz, plaintext 
#menu2 li a:link, #menu2 li a:visited {
background: url("img/zak1.gif") no-repeat;
font-size: 16px;
font-weight: bold;
text-align: center;
color: #3c6a38;
width: 100px;
height: 30px;
float: left;
padding: 5px 0px;
}
 
#menu2 li a:hover {
background: url("img/zak2.gif") no-repeat;
color: #fff;
}
[CSS] pobierz, plaintext 

Chciałbym zrobić aby po otwarciu danej strony np. 2 zakładka była aktywna i wyglądała jak po najechaniu myszą.
ktoś podpowie jak to zrobić?

Ten post edytował thek 22.06.2010, 11:19:18

Powód edycji: [thek]: bbcode poprawiłem

[thek]

Z bbcode chodzi mi o to, by stosować właściwy do właściwego języka. U Ciebie 1 fragment to HTML a drugi to CSS. Czemu więc oba są walnięte do CODE? Nie po to jest kolorowanie składni na forum wstawione userom by sobie po prostu było, ale by z niego korzystali bo to ułatwia analizę kodu i wyszukiwanie ewentualnych błędów. Teraz wszystko jest pisane jednym ciągiem. Użycie odpowiedniego bbcode koloruje składnię.

Co do tematu, to kod jest podobny do tego co podałeś w swoim drugim poście, czyli każdy z elementów listy ma formę:

[HTML] pobierz, plaintext 
<li><a href="index.php?page=liczba"<?php echo ($_GET['page']==liczba ? ' class="aktywna"' : '') ?>>liczba</a></li>
[HTML] pobierz, plaintext 

Oczywiście zamiast liczba jest konkretny numer.
Z kolei css (nieważne czy dołączony z zewnątrz, w znaczniku <style> czy inaczej) powinien zawierać definicję

[CSS] pobierz, plaintext 
.aktywna {color:red;}
[CSS] pobierz, plaintext 

To co może sprawiać problem, to ewentualna kaskadowość tych arkuszy (nadpisywanie sobie stylu) lub "wartość punktowa". Mało kto z początkujących wie, że definicja ma swoje zależności, które można określić punktami. I tak definicja dla id (#) dostanie ich więcej niż dla klasy ( . ), jeśli więc zajdzie sytuacja, że przeglądarka będzie musiała decydować, który styl zastosować, wybierze ten z wyższą "wartością punktową". Takich "zasad" jest kilka i kto ich nie zna, może się zdziwić czasem czemu działa mu kod dziwnie.
Podam przykład:

[CSS] pobierz, plaintext 
#jeden {color:red;}
.jeden {color:blue;}
[CSS] pobierz, plaintext 

[HTML] pobierz, plaintext 
<p id="jeden" class="jeden">Będę czerwony czy niebieski?</p>
[HTML] pobierz, plaintext 

A to tylko najprostsze z możliwych miejsc wpadki. Zauważ, że mogłeś element zdefiniować w CSS jako #menu2 li a i wtedy link nie musi zawierać w sobie słowa class czy id. Przeglądarka sama prawidłowo zinterpretuje i znajdzie pasujący do wzorca. Zdefiniuj sobie więc:
#menu2 li a {} oraz #menu2 li a.aktywna{} i popatrz wtedy co i jak.