Verschiedene Rollover Klassen

[fsommer]

Moin,

ich habe noch nicht wirklich viel Ahnung von CSS und eigne es mir aber gerade an. Ich habe eine einfache Seite ertellt mit zwei bereichen. auf der Rechten Seite erscheint der Content der Seite. Der Content soll formatiert sein (.content) und wenn ein link im Content erscheint (a.content) soll dieser ein Rollover Effekt haben. Wie kann ich das machen?? Mein Ansatz war folgender:

  
.content {  
	font-family: Arial, Helvetica, Sans-Serif;  
	font-size: 9pt;  
	color: #760220;  
}  
  
a.content 	  {  color: #760220; text-decoration: none; }  
a.content:hover	  {  color: #760220; text-decoration: underline; }  
a.content:visited { color: #760220; text-decoration: none; }  
  

im HTML-Code dann so:

  
.  
.  
<td class="content">FORMATIERTER TEXT <a href:"link">FORMATIERTER LINK MIT ROLLOVEREFFEKT<a/></td>  
.  
.  

nur irgendwie passiert da nix :(
Danke für jede Antwort

[ChrisB]

Hi,

Der Content soll formatiert sein (.content) und wenn ein link im Content erscheint (a.content) soll dieser ein Rollover Effekt haben. Wie kann ich das machen??

Mit einem passenden Selektor.

a.content:hover   {  color: #760220; text-decoration: underline; }

Die Links (A-Elemente) haben ja gar nicht selber die Klasse content, sondern ihr Vorfahrenelement - also nutze den Nachfahren-Selektor, um die Links innerhalb des Elementes mit der Klasse content anzusprechen.

MfG ChrisB

[fsommer]

und wie kann dann so etwas aussehen?

[Peter Pan]

Hi!

und wie kann dann so etwas aussehen?

  
.content a {  
  ....  
}  

off:PP

[MudGuard]

Hi,

a.content   {  color: #760220; text-decoration: none; }
a.content:hover   {  color: #760220; text-decoration: underline; }
a.content:visited { color: #760220; text-decoration: none; }

Aufgrund der Reihenfolge der Angaben wird es bei bereits besuchten Links keinen Effekt geben.

Die meist gewünschte Reihenfolge ist :link :visited :focus :hover :active

<td class="content">FORMATIERTER TEXT <a href:"link">FORMATIERTER LINK MIT ROLLOVEREFFEKT<a/></td>

Du hast also keinen Link - ein Link ist ein a-Element mit href-Attribut.
Du hast aber kein href-Attribut, sondern ein "link"-Attribut im Namespace href (wobei ich davon ausgehe, daß der Name "link" wegen der "" nicht zulässig ist).
Oder sollte der : ein = sein?

Und dann hast Du noch ein leeres a-Element (direkt vor dem schließenden td ...) - <a/> und </a> sind vollkommen unterschiedliche Dinge ...

Daß a.content nicht passen kann, hat ChrisB Dir ja schon gesagt ...

cu,
Andreas