没有< center ></center>如何居中？

Question

我现在有这样的代码：

<tr>
    <td>1</td>
    <td><center> enE jk <br> 5.6 </center></td>
    <td><center> mtE hp <br>  6.4 </center></td>
    <td><center> hpE eb <br> HML </center></td>
    <td><center> reE pm <br> 514 </center></td>
    <td><center> hpE eb <br> HP2</center></td>

但是，我不想一直使用<center></center>...

有什么帮助吗？

Answer 1

考虑使用CSS属性text-align。

​

table {
  border-collapse: collapse;
}

td {
  border: 1px solid #AAA;
  padding: .5em 1em;
  text-align: center;
}

<table>
  <tr>
    <td>1</td>
    <td>enE jk<br>5.6</td>
    <td>mtE hp<br>6.4</td>
    <td>hpE eb<br>HML</td>
    <td>reE pm<br>514</td>
    <td>hpE eb<br>HP2</td>
  </tr>
</table>

​

Answer 2

不要使用<center></center>，它是折旧的。取而代之的是使用text-align属性，该属性用于定位文本。

您只需向td元素添加样式并使用center属性。你可以这样做：

<style>
td {
    text-align: center;
}
</style>

或者您可以将text-align: center;直接添加到每个td中，如下所示：

<td style="text-align:center"> enE jk <br> 5.6 </td>

或者使用和外部样式脚本(推荐)。

下面是一个有效的代码片段：

​

td {
  text-align: center;
}

<table><tr>
  <td>1</td>
  <td>
     enE jk <br> 5.6
  </td>
  <td>
    mtE hp <br> 6.4
  </td>
  <td>
    hpE eb <br> HML
  </td>
  <td>
    reE pm <br> 514
  </td>
  <td>
     hpE eb <br> HP2
  </td>
</tr></table>

​

text-align有三个属性：

将文本居中的center

将文本左对齐的left

将文本右对齐的right。

text-align property can be found here的参考