Bagaimana untuk memusatkan jadual dalam html

Dalam HTML, anda boleh menggunakan tiga kaedah untuk memusatkan jadual: Gunakan jidar: atribut auto untuk memusatkan jadual secara mendatar. Gunakan atribut text-align: center; untuk memusatkan jadual secara menegak dalam elemen induk. Gunakan atribut align untuk menentukan kedudukan jadual berbanding dengan elemen induk (tidak digunakan lagi).

Cara memusatkan jadual HTML

Dalam HTML, terdapat beberapa cara untuk memusatkan jadual:

1. Gunakan margin: auto;

untuk menetapkan atribut membenarkan jadual dipusatkan secara mendatar.
• margin: auto; 属性，可以让表格在水平方向上居中。

示例：

<code class="html"><table style="margin: auto;">
  <tr>
    <th>列 1</th>
    <th>列 2</th>
  </tr>
  <tr>
    <td>数据 1</td>
    <td>数据 2</td>
  </tr>
</table></code>

2. 使用 text-align: center;

• 给表格的父元素设置 text-align: center; 属性，可以让表格在父元素内垂直居中。

示例：

<code class="html"><div style="text-align: center;">
  <table border="1">
    <tr>
      <th>列 1</th>
      <th>列 2</th>
    </tr>
    <tr>
      <td>数据 1</td>
      <td>数据 2</td>
    </tr>
  </table>
</div></code>

3. 使用 align 属性

• 给表格设置 align 属性，可以指定表格相对于其父元素的位置。

示例：

<code class="html"><table align="center">
  <tr>
    <th>列 1</th>
    <th>列 2</th>
  </tr>
  <tr>
    <td>数据 1</td>
    <td>数据 2</td>
  </tr>
</table></code>

注意：

• align 属性在 HTML5 中已弃用，应优先使用 margin 或 text-align
• Contoh:
• rrreee

2 Gunakan text-align: center;🎜🎜🎜🎜 untuk menetapkan atribut text-align: center; kepada elemen induk jadual untuk dibuat. jadual dalam induk Berpusat secara menegak dalam elemen. 🎜🎜🎜🎜Contoh: 🎜🎜rrreee🎜🎜3 Gunakan atribut align🎜🎜🎜🎜 untuk menetapkan atribut align untuk jadual untuk menentukan kedudukan jadual berbanding elemen induknya. 🎜🎜🎜🎜Contoh: 🎜🎜rrreee🎜🎜Nota: 🎜🎜🎜🎜 atribut align tidak digunakan dalam HTML5, gunakan margin atau text- align atribut. 🎜🎜Jika lebar ditetapkan untuk meja, kesan pemusatan mungkin terjejas. 🎜🎜Kaedah di atas boleh digunakan untuk memusatkan meja secara mendatar atau menegak. 🎜🎜

Atas ialah kandungan terperinci Bagaimana untuk memusatkan jadual dalam html. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!