Linkeigenschaften für Bilder ausschließen

1 elena

Hallo,
ich möchte auf der folgenden Seite die in einer externen css-Datei für den #inhalt a:hover, a:focus festgelegten Eigenschaften ({border-bottom: 1px solid #FFFF00;}) ausschalten, und zwar nur für die Bilder und nur auf dieser Seite. Folgende Eingabe bringt mich nicht weiter:
</script>
<style type="text/css">
#inhalt img a:hover, a:focus {border-bottom:none;}
</style>

http://www.anita-foernges.de/uebungssite/start_html/start_bericht_galerie_suedafrika.html
Ich will damit den "Wackeleffekt" beim FF unterbinden. Neulich hatte ich dieselbe Frage, allerdings bezog es sich da auf eine Tabelle. Hier bezieht es sich nur auf die Bilder.

elena

2 Jörg Kruse

Hallo elena,

die Verschachtelungsreihenfolge ist ja #inhalt -> a -> img - deswegen funktioniert deine Reihenfolge nicht. Es sollten ja Links angesprochen werden, die sich innerhalb von #inhalt befinden und ein img enthalten. Da letzteres nicht über einen Selektor zu identifizieren ist, würde ich eine Klasse "img" definieren, z.B.:

<a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Elefant','','../images/reisen/suedafrika/elefant_r.jpg',1)" class="img"><img src="../images/reisen/suedafrika/elefant_n.jpg" alt="Elefant" name="Elefant" width="300" height="203" border="0" id="Elefant" style="padding:10px 30px 0px 30px;" /></a>

Dann kannst du diese folgendermaßen ansprechen:

#inhalt a.img:hover, #inhalt a.img:focus {
border-bottom:none;
}

3 elena

Danke erst einmal für die rasche Antwort!! Leider habe ich noch eine kleine (oder große) Denkblockade:

Das mit dem Ansprechen ist mir klar. Aber wo definiere ich denn die class="img" ?? Schreibe ich da in die externe css-Datei
.img
{ a:hover, a:focus:border-bottom:none;}

Sorry, wenn ich so dumme Fragen stelle, aber manchmal geht's einfach nicht weiter.

elena

4 Jörg Kruse

Das class="img" schreibst du direkt in die Link-Tags im HTML-Teil, so wie ich es im ersten Code-Abschnitt in meinem letzten Beitrag beispielhaft angegeben habe

Den zweiten Code-Abschnitt mit der CSS-Definition kannst du entweder in ein style Element im head Bereich der HTML-Datei einbauen:

<style type="text/css">
/* <![CDATA[ */
#inhalt a.img:hover, #inhalt a.img:focus {
border-bottom:none;
}
/* ]]> */
</style>

- dann gilt diese Definiton nur für diese Seite. Du kannst ihn aber auch in die externe CSS-Datei http://www.anita-foernges.de/uebungssite/style.css einbauen - was sinnvoll ist, wenn du diese Klasse auf mehreren Seiten verwenden möchtest

5 elena

Danke Jörg, es hat geklappt!!
Wenn diese Situation öfter vorkommt, werde ich es in die externe style.css einbauen.

Danke nochmals!!!!
Hier das Ergebnis:
http://www.anita-foernges.de/uebungssite/start_html/start_bericht_galerie_suedafrika.html

elena

nach oben

Linkeigenschaften für Bilder ausschließen

Beitrag schreiben (als Gast)