Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS][HTML]CSS HOVER IMAGE
Cocain3
post
Post #1





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 31.08.2013

Ostrzeżenie: (0%)
-----


Witam, mam problem ze zmianą obrazka po najechaniu myszy mój kod HTML wygląda tak:
Chyba nie ma różnicy czy obrazek jest PNG czy JPEG?
POMOCY arrowheadsmiley.png
  1. <title>Szablon Allegro</title>
  2. <style type="text/css">
  3. ofirmie {
  4. background-image: url('adres/obrazek.png');
  5. background-repeat: no-repeat;
  6. width: 200px;
  7. height: 150px;
  8. display: block;
  9. }
  10. ofirmie:hover {
  11. background-image: url('adres/obrazek_hover.png');
  12. background-repeat: no-repeat;
  13. width: 200px;
  14. height: 150px;
  15. }
  16. </head>
  17. <body leftmargin="0" topmargin="0"
  18. style="background-color: rgb(255, 255, 255);" marginheight="0"
  19. marginwidth="0">
  20. <!-- Save for Web Slices (Szablon Allegro KeyBlack.psd) -->
  21. <table id="Tabela_01" border="0" cellpadding="0" cellspacing="0"
  22. height="2801" width="1200">
  23. <tr>
  24. <td colspan="3"> <img style="width: 411px; height: 36px;"
  25. src="ADRES URL MOJEGO ZDJECIA"
  26. alt=""></td>


I teraz tak jak mam dodać ten kod CSS co jest powyżej do tego obrazka aby zaczeło działać tak jak należy i nie robiło żadnych szkód w szablonie...
Proszę o pomoc.

Ten post edytował Cocain3 31.08.2013, 16:25:16
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi (1 - 3)
lobopol
post
Post #2





Grupa: Zarejestrowani
Postów: 1 729
Pomógł: 346
Dołączył: 4.04.2009

Ostrzeżenie: (0%)
-----


Co ty chcesz osiągnąć? Nie masz takiego taga "ofirmie" więc go nie ostylujesz, jakby to była klas ".ofirmie" bądź id "#ofirmie" mógłbyś coś działać. Ba w samym html nie masz niczego co się nazywa ofirmie.


--------------------
Go to the top of the page
+Quote Post
Cocain3
post
Post #3





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 31.08.2013

Ostrzeżenie: (0%)
-----


Chcem osiągnać zmiane obrazka po najechaniu myszką smile.gif

  1. <title>Szablon Allegro</title>
  2. <style type="text/css">
  3. a {
  4. background-image: url('adres/obrazek.png');
  5. background-repeat: no-repeat;
  6. width: 200px;
  7. height: 150px;
  8. display: block;
  9. }
  10. a:hover {
  11. background-image: url('adres/obrazek_hover.png');
  12. background-repeat: no-repeat;
  13. width: 200px;
  14. height: 150px;
  15. }
  16. </head>
  17. <body leftmargin="0" topmargin="0"
  18. style="background-color: rgb(255, 255, 255);" marginheight="0"
  19. marginwidth="0">
  20. <!-- Save for Web Slices (Szablon Allegro KeyBlack.psd) -->
  21. <table id="Tabela_01" border="0" cellpadding="0" cellspacing="0"
  22. height="2801" width="1200">
  23. <tr>
  24. <td colspan="3"> <img style="width: 411px; height: 36px;"
  25. src="ADRES URL MOJEGO ZDJECIA"
  26. alt=""></td>


Więc zmieniłem na ,,a" ale teraz powiedz jak zrobić aby to działało smile.gif
Go to the top of the page
+Quote Post
valkirek
post
Post #4





Grupa: Zarejestrowani
Postów: 117
Pomógł: 6
Dołączył: 24.07.2013

Ostrzeżenie: (0%)
-----


  1. a.ofirmie {
  2. ...
  3. }
  4.  
  5. a:hover.ofirmie {
  6. ...
  7. }
  8. <a class="ofirmie" href="#">...</a>


  1. img.ofirmie {
  2. ...
  3. }
  4.  
  5. img:hover.ofirmie {
  6. ...
  7. }
  8. <img class="ofirmie" src="..."/>


jesli chcesz hovera na sam obrazek bez linka to nie wiem czy we wszystkich przegladarkach to dziala
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 20.08.2025 - 06:31