css table鼠标替换背景颜色

CSS table鼠标替换背景颜色，是指当鼠标移动到表格的某一行或列上方时，该行或列的背景色会被替换成另外一种颜色。这种效果可以提升表格的交互性和美观性。

  /* HTML */
  <table>
    <thead>
      <tr>
        <th>姓名</th>
        <th>年龄</th>
        <th>性别</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>张三</td>
        <td>20</td>
        <td>男</td>
      </tr>
      <tr>
        <td>李四</td>
        <td>25</td>
        <td>女</td>
      </tr>
      <tr>
        <td>王五</td>
        <td>30</td>
        <td>男</td>
      </tr>
    </tbody>
  </table>

  /* CSS */
  table tbody tr:hover {
    background-color: yellow;
  }

上述代码中，我们首先使用HTML创建了一个表格，包括表头和表体。接着，通过CSS选择器和:hover伪类，给表格的行添加了鼠标悬停时的背景色，此处为黄色。当鼠标移动到表格的某一行上方时，该行的背景色会发生变化，让表格看起来更加生动。