CSS: hintergrundfarbe in tabellenzeile

Dieses Thema im Forum "Web Page Design" wurde erstellt von ben-pen, 15.08.2006.

  1. ben-pen

    ben-pen Thread Starter MacUser Mitglied

    Beiträge:
    1.375
    Zustimmungen:
    8
    MacUser seit:
    26.08.2005
    Hallo, wiei ändere ich die hintergrundfarbe einer ganzen tabellenzeile bei mouse over?

    So siehr es bei aus:

    wenn es nur die zelle sein soll funktioniert es mit "display: block"
    aber "table-row" funktioniert nicht

    vielen Dank für Hilfe

    BP
     
  2. msslovi0

    msslovi0 MacUser Mitglied

    Beiträge:
    2.713
    Zustimmungen:
    115
    MacUser seit:
    20.03.2005
    HTML:
    <style type="text/css">
    	.productTable tr {
    		background: #CCC;	
    	}
    	.productTable tr:hover {
    		background: #FF0;
    	}	
    </style>
    
    <table class="productTable">
    	<tr>
    		<td>1</td>
    		<td>2</td>
    		<td>3</td>
    		<td>4</td>
    	</tr>
    	<tr>
    		<td>1</td>
    		<td>2</td>
    		<td>3</td>
    		<td>4</td>
    	</tr>
    	<tr>
    		<td>1</td>
    		<td>2</td>
    		<td>3</td>
    		<td>4</td>
    	</tr>
    </table>
    
    Siehe auch http://www.css4you.de/hover.html

    Matt
     
  3. ben-pen

    ben-pen Thread Starter MacUser Mitglied

    Beiträge:
    1.375
    Zustimmungen:
    8
    MacUser seit:
    26.08.2005
    Super vielen Dank.

    ist es auch möglich dies auch einzelene Zeilen einer Tabelle zuzuweisen?

    Also nicht für die komplette Tabelle.
     
  4. Einfach das gleiche für <tr> statt für <table> definieren... oder nicht?
     
  5. ThaHammer

    ThaHammer MacUser Mitglied

    Beiträge:
    3.277
    Zustimmungen:
    13
    MacUser seit:
    01.06.2004
    Wenn Du die Klasse dem td zuweist gehst auch für jede Zelle!
     
  6. msslovi0

    msslovi0 MacUser Mitglied

    Beiträge:
    2.713
    Zustimmungen:
    115
    MacUser seit:
    20.03.2005
    Es ist ja für tr definiert. Er will es aber für bestimmte Zeilen haben:
    HTML:
    <style type="text/css">
    	.productTable tr {
    		background: #CCC;	
    	}
    	.productTable tr.hover:hover {
    		background: #FF0;
    	}	
    </style>
    
    <table class="productTable">
    	<tr class="hover">
    		<td>1</td>
    		<td>2</td>
    		<td>3</td>
    		<td>4</td>
    	</tr>
    	<tr>
    		<td>1</td>
    		<td>2</td>
    		<td>3</td>
    		<td>4</td>
    	</tr>
    	<tr class="hover">
    		<td>1</td>
    		<td>2</td>
    		<td>3</td>
    		<td>4</td>
    	</tr>
    </table>
    
    Matt
     
  7. ben-pen

    ben-pen Thread Starter MacUser Mitglied

    Beiträge:
    1.375
    Zustimmungen:
    8
    MacUser seit:
    26.08.2005
    Perfekt @ msslovi0

    Danke
     
Die Seite wird geladen...

Diese Seite empfehlen