如何在表格中呈现多个单选按钮

<table>
  <tr>
    <td><input type="radio" name="option1"></td>
    <td><input type="radio" name="option2"></td>
    <td><input type="radio" name="option3"></td>
  </tr>
  <tr>
    <td><input type="radio" name="option1"></td>
    <td><input type="radio" name="option2"></td>
    <td><input type="radio" name="option3"></td>
  </tr>
</table>

<table>
  <tr>
    <td><label for="option1"><input type="radio" id="option1" name="option"></label></td>
    <td><label for="option2"><input type="radio" id="option2" name="option"></label></td>
    <td><label for="option3"><input type="radio" id="option3" name="option"></label></td>
  </tr>
  <tr>
    <td><label for="option1"><input type="radio" id="option1" name="option"></label></td>
    <td><label for="option2"><input type="radio" id="option2" name="option"></label></td>
    <td><label for="option3"><input type="radio" id="option3" name="option"></label></td>
  </tr>
</table>

<style>
  .custom-radio input[type="radio"] {
    display: none;
  }

  .custom-radio label {
    display: inline-block;
    padding: 5px 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    cursor: pointer;
  }

  .custom-radio input[type="radio"]:checked + label {
    background-color: #ccc;
  }
</style>

<table>
  <tr>
    <td class="custom-radio"><input type="radio" id="option1" name="option"><label for="option1">Option 1</label></td>
    <td class="custom-radio"><input type="radio" id="option2" name="option"><label for="option2">Option 2</label></td>
    <td class="custom-radio"><input type="radio" id="option3" name="option"><label for="option3">Option 3</label></td>
  </tr>
  <tr>
    <td class="custom-radio"><input type="radio" id="option1" name="option"><label for="option1">Option 1</label></td>
    <td class="custom-radio"><input type="radio" id="option2" name="option"><label for="option2">Option 2</label></td>
    <td class="custom-radio"><input type="radio" id="option3" name="option"><label for="option3">Option 3</label></td>
  </tr>
</table>