Bagaimanakah saya boleh memusatkan teks secara mendatar dan menegak dalam jadual HTML?

Menjajarkan Teks dalam Jadual HTML Secara Mendatar dan Menegak

Dalam jadual HTML, memusatkan teks dalam setiap sel, secara mendatar dan menegak, boleh meningkatkan persembahan dan kebolehbacaan data anda. Berikut ialah panduan terperinci untuk mencapai matlamat ini:

Penjajaran Mendatar

Untuk memusatkan teks secara mendatar, gunakan sifat CSS penjajaran teks. Tambah text-align: center; kepada atribut gaya

elemen. Ini akan menjajarkan teks di tengah setiap sel.

Penjajaran Menegak

Untuk penjajaran menegak, gunakan sifat CSS penjajaran menegak. Tetapkan penjajaran menegak: tengah; untuk memastikan bahawa teks berpusat secara menegak di dalam sel. Sifat ini mungkin perlu dilaraskan berdasarkan ketinggian sel.

Contoh dengan Penggayaan Sebaris

Anda boleh menggunakan gaya sebaris dalam jadual untuk menggunakan penjajaran ini:

<code class="html"><table border="1">
  <tr>
    <td style="text-align: center; vertical-align: middle;">Text</td>
    <td style="text-align: center; vertical-align: middle;">Text</td>
  </tr>
</table></code>

Contoh dengan Kelas CSS

Sebagai alternatif, anda boleh mencipta kelas CSS untuk menggunakan penjajaran:

<code class="css">.center-text {
  text-align: center;
  vertical-align: middle;
}</code>

Dan gunakannya dalam jadual:

<code class="html"><table border="1">
  <tr>
    <td class="center-text">Text</td>
    <td class="center-text">Text</td>
  </tr>
</table></code>

Ingat, ketinggian dan lebar sel yang ditentukan boleh menjejaskan penjajaran menegak. Laraskan nilai mengikut keperluan untuk mencapai hasil yang diingini.

Atas ialah kandungan terperinci Bagaimanakah saya boleh memusatkan teks secara mendatar dan menegak dalam jadual HTML?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!