[CSS] Mouseover

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • [CSS] Mouseover

    Hallo @ all

    Habe diese beiden Codes:

    Quellcode

    1. .menue_links {
    2. background-image:url(images/links.jpg);
    3. background-repeat:no-repeat;
    4. width:156px;
    5. height:67px;
    6. float:left;
    7. text-align:center;
    8. text-decoration:none;
    9. color:#FFF;
    10. }
    12. .menue_mitte {
    13. background-image:url(images/mitte.jpg);
    14. width:156px;
    15. height:67px;
    16. float:left;
    17. text-align:center;
    18. text-decoration:none;
    19. color:#FFF;
    20. }
    Alles anzeigen


    Quellcode

    1. <a href="xyz.html" target="unten"><div class="menue_links">
    2. <br>
    3. Index
    4. </div>
    5. </a>
    6. <div class="menue_mitte">
    7. <br>
    8. Musik
    9. </div>


    Wenn ich jetzt mit der Maus über den Bereich von menue_links gehe soll sich ein anderes background Image laden. Wenn man das auf alle Links im Document beziehen will eght das ja so:

    Quellcode

    1. a:hover {
    2. color: #000000;
    3. background-image: XXXXX;
    4. }


    Aber wie eght das wenn man sich nur auf einen Bereich (in diesem Fall menue_links) beziehen will?

    Hoffe auf eure Hilfe. Viele Grüße
    Crosaider

  • Hey,

    ich wollte noch anmerken: Der HTML Code. Den du geschrieben hast ist nicht Valide (entspricht nicht der Norm) - wird von vielen Browsern aber ignoriert und zurecht gebogen. Dadurch hast du in der Regel aber massive Darstellungsunterschiede, weil es eben keinen Standard gibt, der aussagt, wie so etwas auszusehen hat...

    Das Attribut "hover" darf in CSS - so weit ich weis - nur für Links verwendet werden (a). Also: "a:hover".
    Du kannst aber mit "a:hover span" einen Hovereffekt auf einen "span" in einem Link legen.

    Und ich weis nicht ob das jetzt nur zusammengestückelter HTML-Code ist, aber eine Box in einem Link ist standardmäßig auch nicht erlaubt. Dazu müsstest du dem Link (a) die Eigenschaft "display:bloc;k" zuweisen um einen div (Box) darin platzieren zu können.
    Wenn man sich an solche Sachen hält hat man weit weniger Probleme mit den Unterschiedlichen Browsern UND dem IE - zumindest war das meine eigene Erfahrung.

    Nur ein kleiner Denkanstoß ;)

    Gruß,
    Erasel
    My lovely mister singing club...