Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS] Przeglądarka nie stosuje atrybutów.
Forum PHP.pl > Forum > Przedszkole
thomson89
Witam!

Za pomocą list definicyjnych wykonałem takie proste menu:
  1. <dl id="menu">
  2. <dt><a href=""><img src="menu/strona_glowna1.png" onmouseover="this.src='menu/strona_glowna2.png'" onmouseout="this.src='menu/strona_glowna1.png'"></a></dt>
  3.  
  4. <dt><a href=""><img src="menu/aktualnosci1.png" onmouseover="this.src='menu/aktualnosci2.png'" onmouseout="this.src='menu/aktualnosci1.png'"></a></dt>
  5.  
  6. <dt><a href=""><img src="menu/wspolpraca1.png" onmouseover="this.src='menu/wspolpraca2.png'" onmouseout="this.src='menu/wspolpraca1.png'"></a></dt>
  7.  
  8. <dt><a href=""><img src="menu/kontakt1.png" onmouseover="this.src='menu/kontakt2.png'" onmouseout="this.src='menu/kontakt1.png'"></a></dt>
  9.  
  10.  
  11.  
  12. <dt class="first_button"><img src="menu/pamiatki_sakralne1.png" onmouseover="this.src='menu/pamiatki_sakralne2.png'" onmouseout="this.src='menu/pamiatki_sakralne1.png'"></dt>
  13. <dd><a href="">Element 1.1</a></dd>
  14. <dd><a href="">Element 1.2</a></dd>
  15. <dd class="last"><a href="">Element 1.3</a></dd>
  16.  
  17.  
  18. <dt><img src="menu/bizuteria1.png" onmouseover="this.src='menu/bizuteria2.png'" onmouseout="this.src='menu/bizuteria1.png'"></a></dt>
  19. <dd><a href="">Element 1.1</a></dd>
  20. <dd><a href="">Element 1.2</a></dd>
  21. <dd class="last"><a href="">Element 1.3</a></dd>
  22.  
  23.  
  24.  
  25. <dt class="first_button"><img src="menu/twoje_konto1.png" onmouseover="this.src='menu/twoje_konto2.png'" onmouseout="this.src='menu/twoje_konto1.png'"></a></dt>
  26.  
  27. <dt><a href=""><img src="menu/koszyk1.png" onmouseover="this.src='menu/koszyk2.png'" onmouseout="this.src='menu/koszyk1.png'"></a></dt>
  28.  
  29.  
  30.  
  31. <dt class="first_button"><a href=""><img src="menu/zaloguj_sie1.png" onmouseover="this.src='menu/zaloguj_sie2.png'" onmouseout="this.src='menu/zaloguj_sie1.png'"></a></dt>
  32.  
  33. <dt class="last_button"><a class="last_button" href=""><img class="last_button" src="menu/zarejestruj_sie1.png" onmouseover="this.src='menu/zarejestruj_sie2.png'" onmouseout="this.src='menu/zarejestruj_sie1.png'"></a><dt>


  1. #menu a {
  2. color: black;
  3. text-decoration: none;
  4. border: 0px;
  5. }
  6. #menu a:hover img {
  7. border: none;
  8. }
  9. #menu a:hover {
  10. color: black;
  11. text-decoration: none;
  12. border-bottom: 1px dotted;
  13. }


Ale niestety, #menu a:hover img, nie działa i obrazki mają dolne obramowanie, co nie jest u mnie pożądane.

Jak to naprawić?
Meares
Kod
text-decoration: none;

Jeśli chodzi o to o czym myślę. haha.gif
thomson89
Nie...

Dodałem, specjalną klasę dla obrazków, aby nie miały obramowania po najechaniu na nie myszką, ale to nie działa. Obramowanie chcę zachować tylko dla linków dd. A dla obrazów w dt nie.
seth-kk
#menu a:hover - dodaje obramowanie do linka
#menu a:hover img - usowa obramowanie z obrazka w linku
uzyj dodatkowej klasy dla linkow z obrazkami
thomson89
Przykładowo, dałem:

  1. <dt><a href="" class="cos"><img src="menu/kontakt1.png" onmouseover="this.src='menu/kontakt2.png'" onmouseout="this.src='menu/kontakt1.png'"></a></dt>


  1. #menu .cos a:hover {
  2. border: 0;
  3. }



->EDIT

dałem style lokalne i działa normalnie
  1. style="border: 0;"


a jak zrobić w zewnętrznych?
seth-kk
podstawy:
  1. a.cos:hover

a nie
  1. .cos a:hover

i zwroc uwage na kolejnosc styli
thomson89
Dzięki.
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.