CSS - Tabellenzeilen bei :hover hervorheben

<style>

table#table {

 border-spacing: 5px;

}



table#table th,

table#table td {

 border: Solid 1px #FF8000;

 padding: 5px;

 text-align: Left;

}



table#table th.frage {

 color: #F07800;

}



table#table th.zeile1:hover + td,

table#table th.zeile2:hover + td  + td,

table#table th.zeile3:hover + td  + td  + td,

table#table th.zeile4:hover + td  + td  + td  + td,

table#table th.zeile5:hover + td  + td  + td  + td  + td {

 box-shadow: Inset 0px 0px 100px 100px #FF8000;

}

</style>



<table id="table">

 <tr>

  <th class="zeile5 frage">Myanmar</th>

  <td>Lomé</td>

  <td>Tarawa</td>

  <td>Niamey</td>

  <td>Asunción</td>

  <td>Naypyidaw</td>

 </tr>

 <tr>

  <th class="zeile3 frage">Paraguay</th>

  <td>Lusaka</td>

  <td>Abuja</td>

  <td>Asunción</td>

  <td>Hanga Roa</td>

  <td>Saint-Denis</td>

 </tr>

 <tr>

  <th class="zeile1 frage">Ecuador</th>

  <td>Quito</td>

  <td>Tarawa</td>

  <td>Port Louis</td>

  <td>Niamey</td>

  <td>Funafuti</td>

 </tr>

 <tr>

  <th class="zeile2 frage">Tonga</th>

  <td>Victoria</td>

  <td>Nukuʻalofa</td>

  <td>Lomé</td>

  <td>Saint-Denis</td>

  <td>Niamey</td>

 </tr>

 <tr>

  <th class="zeile4 frage">Tuvalu</th>

  <td>Abuja</td>

  <td>Lusaka</td>

  <td>Asunción</td>

  <td>Funafuti</td>

  <td>Mbabane</td>

 </tr>

</table>

Bausteine  Alle Anzeigen

Eine zufällige Auswahl von Codeschnipseln aus den Bereichen HTML, CSS, PHP, JavaScript und MySQL.

<script> JavaScript

CSS - Vertikale Schrift

PHP - Text nach dem Alphabet sortieren

JavaScript - Audiodateien per Button-Klick abspielen

MySQL - Datensatz eintragen