鼠标悬停在HTML-TABLE的某一行上 改变这一行的背景颜色

主要CSS代码:

    #table1 tbody tr:hover {
        background-color: yellow;
    }

解释: ID为table1的table里的tbody里的tr的hover时,背景颜色改为:yellow 黄色...

主要是: tr:hover{  background-color: yellow; }  这一段...

---

完整代码:

<style>
    #table1 tbody tr:hover {
        background-color: yellow;
    }
</style>

<table id="table1" border="1" width="100%">
<thead>
    <tr>
        <th>日期</th>
        <th>供应商名称</th>
        <th>品牌</th>
        <th>品线</th>
        <th>品类</th>
    </tr>
</thead>
<tbody id="tbody1">
    <tr>
        <th>日期</th>
        <th>供应商名称</th>
        <th>品牌</th>
        <th>品线</th>
        <th>品类</th>
    </tr>
    <tr>
        <th>日期</th>
        <th>供应商名称</th>
        <th>品牌</th>
        <th>品线</th>
        <th>品类</th>
    </tr>
</tbody>
</table>

---

样式效果: