Question Comment surligner la ligne de la table lors du survol en utilisant uniquement CSS?


Est-il possible de mettre en évidence la rangée de la table en vol stationnaire (quelque chose comme ce) en utilisant uniquement CSS (sans JavaScript)?


29
2017-10-24 07:05


origine


Réponses:


Oui, une ligne est possible mais pas une colonne.

tr:hover {
  background-color: lightyellow;
}

52
2017-10-24 07:08



Oui, c'est possible, mais vous devez vous soucier de la compatibilité du navigateur ici

<style type="text/css">
    .tbl {width: 640px;}
    .tbl tr {background-color: Blue; height: 24px}
    .tbl tr:hover {background-color: Red;}
</style>


<table class="tbl">
    <tr><td></td><td></td><td></td></tr>
    <tr><td></td><td></td><td></td></tr>
    <tr><td></td><td></td><td></td></tr>
    <tr><td></td><td></td><td></td></tr>
</table>

3
2017-10-24 07:21



Si vous ne vous souciez pas d'Internet Explorer, le :flotter La pseudo-classe CSS fonctionne avec n'importe quel élément.

Si vous faire attention à IE, vous pouvez trouver une solution de contournement ici.


2
2017-10-24 07:09



<style type="text/css">
   tr.tr-hover-class:hover {
      background: grey !important;
   }
</style>

<table>
   <tr class='tr-hover-class'></tr>
</table>

1
2018-02-23 12:11