如何在表格上设置边框

0 html css html-table css-tables

假设我有一个table包含大量数据的元素.

table {
  background-color: skyblue;
  width: 100%;
  margin: auto;
  text-align: center;
}
Run Code Online (Sandbox Code Playgroud)
<table>
  <tbody>
    <tr>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
    </tr>
    <tr>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
    </tr>
    <tr>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
    </tr>
    <tr>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
    </tr>
    <tr>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
    </tr>
    <tr>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
      <td>My Name</td>
    </tr>
  </tbody>
</table>
Run Code Online (Sandbox Code Playgroud)

什么是border-style: dashed; border-color: black; border-size: 3px;在每个偶数上设置边界的最佳方法td.

请解释一下.

小智 6

你可以尝试:

td:nth-child(even) {
   border-style: dashed; 
   border-color: black; 
   border-size: 3px;
}
Run Code Online (Sandbox Code Playgroud)