• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Link über eine ganze Tabellenzeile

Status
Für weitere Antworten geschlossen.

feyyaz

Neues Mitglied
Link über eine ganze Tabellenzeile

mit css ist es möglich einen link (<a> tag) so einzustellen das er auch den hintergrund ändert (siehe nav leiste im beispiel)

ich will nun aber in einer Tabelle die ganze zeile verändern. in dem beispiel ist eine Tabelle mit 3 Zeilen, wenn ich über einer zeile bin sollen alle drei spalten highlited werden (wie in der nav leiste, dort wird aber nur eine spalte gehighleited).

Ist das möglich ?

Beispiel: http://www.paob.de/html.de/tabelle_sel.htm
 
außer dem linkelement sind mir keine css-möglichkeiten bekannt einen hovereffekt auszulösen.

UPDATE 28.11. : die behauptung stimmt nicht mehr, bitte weiterlesen
 
Also ich weiß, dass es mit CSS alleine auch geht. Man kann sogar machen, dass der link kommt ohne, dass man über dem Text ist, sondern nur über der Zelle. Allerdings weiß ich leider nicht ernsthaft wie das geht. Aber du kannst das in vielen Templates nachschauen...
 
virtuellesNugat schrieb:
Also ich weiß, dass es mit CSS alleine auch geht. Man kann sogar machen, dass der link kommt ohne, dass man über dem Text ist, sondern nur über der Zelle....
diese art von hovereffekt geht natürlich alleine mit css zu machen.
was fayyaz aber wollte ist reinen text einen hovereffekt zu geben
und das über drei spalten gleichzeitig. das geht mit css nicht allein.

UPDATE 28.11. : die letzte behauptung stimmt nicht mehr, bitte weiterlesen
 
heute habe ich wieder eine lektion gelernt :
die pseudoelemente :hover :active :focus lassen sich bei allen elementen verwenden
(html & head dürften ausgenommen sein), ein Beispiel :

Code:
<head>
 <style type="text/css">
 tr:hover { font-weight:bold; background:#D7FFD7; color:#3D33B3 }
 </style>
</head>

<body>
 <table width="100%" border="2">
 <colgroup width="50%" span="2"></colgroup>
 <tr>
 <td> testzeile 1 / spalte 1</td>
 <td> spalte 2</td>
 </tr>
 <tr>
 <td> testzeile 2 / spalte 1</td>
 <td> spalte 2</td>
 </tr>
 </table>
</body>
das dumme an der ganzen sache ist, das nicht alle browser alles können, zum beispiel mein IE weigert sich fast komplett. dazu gibt es aber Firefox der alle meine test bisher bestanden hat.

die annahme das :hover & co. nur bei links funktioniert kommt daher das mein css-editor beim erstellen neuer selectoren nur beim element a die pseudoelemente :hover :active :focus anbietet. hingegen beim validieren es für problemlos befindet diese pseudoelement anderweitig zu verwenden.

EDIT : 19:57
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben