Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Problem z hoverem w css
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
Kiubus
Witam.
Mam taki oto kod CSS:
Cytat
a:link { color: aqua; text-decoration: none; font-size: large; font-family: Arial, Verdana; font-weight: bold }
a:visited { color: aqua; text-decoration: none; font-size: large; font-family: Arial, Verdana; font-weight: bold }
a:hover { color: red; text-decoration: none; font-size: large; font-family: Arial, Verdana; font-weight: bold }
a:active { color: red; text-decoration: none; font-size: large; font-family: Arial, Verdana; font-weight: bold }

Wszystko fajnie, pięknie bo kolor tekstu linków w Menu jest biały a po najechaniu robi się czerwony. Chciałbym zrobić tak, że aktualna podstrona jest podświetlana na czerwono, a gdy na nią najedziemy to jest koloru białego. Czyli np. jestem na stronie głównej, to w menu pozycja "Strona Główna" jest czerwona a po najechaniu na nią kursorem jest biała. Pozostałe pozycje są białe i robią się czerwone tylko w momencie najechania na nie kursorem. Może mi ktoś pomóc? Próbowałem robić divem i w CSS do nazwy diva przypisać hovera zmodyfikowanego na kolor biały ale to nic niestety nie pomogło.
Pozdrawiam!
mar1aczi
Dodaj dla aktywnej strony odpowiednią klasę dla "a" i ostyluj.
Kiubus
mógłbyś zapodać jakiś przykład? Bo w kontekście CSS jestem kompletnie zielony :/
mar1aczi
  1. <div id="menu">
  2. <a class="active">Strona główna</a>
  3. <a>podstrona</a>
  4. </div>

  1. #menu {
  2. background-color: grey;
  3. }
  4. a:link { color: aqua; text-decoration: none; font-size: large; font-family: Arial, Verdana; font-weight: bold }
  5. a:visited { color: aqua; text-decoration: none; font-size: large; font-family: Arial, Verdana; font-weight: bold }
  6. a:hover { color: red; text-decoration: none; font-size: large; font-family: Arial, Verdana; font-weight: bold }
  7. a:active { color: red; text-decoration: none; font-size: large; font-family: Arial, Verdana; font-weight: bold }
  8. a.active {color: red; text-decoration: none; font-size: large; font-family: Arial, Verdana; font-weight: bold}
  9. a.active:hover {color: white; text-decoration: none; font-size: large; font-family: Arial, Verdana; font-weight: bold}
Kiubus
wielkie dzięki kolego!
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.