jquery - 使用 CSS 将表格样式设置为井字棋盘

Question

我打算用 jQuery 和 PHP 编写一个井字游戏。我想用 CSS 设计板(一个 html 表格)的样式。我不知道可以选择性地应用于单元格的 CSS 属性，以便特定单元格获得边框。有没有我可以使用的 CSS 属性，或者我应该尝试不同的方法吗？

html 标记是:

  <div id="board">
    <table>
      <tr id="row1">
        <td class="square"></td>
        <td class="square"></td>
        <td class="square"></td>
      </tr>
      <tr id="row2">
        <td class="square"></td>
        <td class="square"></td>
        <td class="square"></td>
      </tr>
      <tr id="row3">
        <td class="square"></td>
        <td class="square"></td>
        <td class="square"></td>
      </tr>
    </table>
  </div>

Answer 1

好吧，为一些 TD 添加第二个类，并只为该类提供边框。

HTML 和 CSS:

.square{
    width:100px;
    height:100px;
}

.v{
    border-left:1px solid #000;
    border-right:1px solid #000;
}

.h{
    border-top:1px solid #000;
    border-bottom:1px solid #000;
}

<div id="board">
    <table>
      <tr id="row1">
        <td class="square"></td>
        <td class="square v"></td>
        <td class="square"></td>
      </tr>
      <tr id="row2">
        <td class="square h"></td>
        <td class="square v h"></td>
        <td class="square h"></td>
      </tr>
      <tr id="row3">
        <td class="square"></td>
        <td class="square v"></td>
        <td class="square"></td>
      </tr>
    </table>
  </div>