如何证明css表格单元格？

Question

基本上我有一个看起来像这样的css表

-------------------------------------------------------------
|     First    |    Middle1    |    Middle2    |    Last    |
-------------------------------------------------------------

我希望得到这个设计

-------------------------------------------------------------
| First        |    Middle1    |    Middle2    |       Last |
-------------------------------------------------------------

第一列与左对齐，中间列与中心对齐，最后一列与右对齐。目前我正在使用一个针对目标的解决方案：first-child和：last-child，以便专门对齐它们。有更好/更聪明的方式吗？

Answer 1

使用td align属性：

td {
  min-width:100px;
  border:1px solid black;
}

<table>
  <tr>
    <td align="left">Left</td>
    <td align="center">Center</td>
    <td align="center">Center</td>
    <td align="right">Right</td>
  </tr>
</table>

Answer 2

现在不推荐使用对齐属性。它们仍然在对齐内容方面起作用，但通常不应该使用。使用CSS伪元素选择器来定位每行中的第一个和最后一个单元格。

td {
    text-align: center;
}

tr td:first-child {
    text-align: left;
}

tr td:last-child {
    text-align: right;
}

Answer 3

使用CSS：

td {
  text-align: center;
}
td:nth-child(1)
{
  text-align: left;
}
td:nth-child(4)
{
  text-align: right;
}