Bagaimana untuk Menjajarkan Tengah Kandungan dalam Sel Jadual HTML?

Mary-Kate Olsen
Lepaskan: 2024-11-02 02:21:02
asal
685 orang telah melayarinya

How to Center Align Content in HTML Table Cells?

Cara Menjajarkan Kandungan dalam Jadual HTML

Apabila mencipta jadual HTML, selalunya wajar kandungan setiap sel dipusatkan kedua-duanya secara mendatar dan menegak. Ini boleh meningkatkan kebolehbacaan dan estetika jadual.

Untuk mendatar memusatkan teks dalam sel jadual, anda boleh menggunakan CSS dengan sifat penjajaran teks. Contoh berikut menunjukkan ini:

<code class="css">td {
    text-align: center;
}</code>
Salin selepas log masuk

Untuk penjajaran menegak, sifat penjajaran menegak boleh digunakan. Coretan kod ini memusatkan teks secara menegak dalam sel:

<code class="css">td {
    vertical-align: middle;
}</code>
Salin selepas log masuk

Anda juga boleh menggunakan atribut gaya sebaris untuk memusatkan teks. Ini boleh menjadi lebih mudah jika anda hanya perlu menggunakan penjajaran pada sel tertentu:

<code class="html"><td style="text-align: center; vertical-align: middle;">Text</td></code>
Salin selepas log masuk

Contoh dengan atribut gaya sebaris:

<code class="html"><table>
    <tr>
        <td style="text-align: center; vertical-align: middle;">Text</td>
        <td style="text-align: center; vertical-align: middle;">Text</td>
    </tr>
</table></code>
Salin selepas log masuk

Menggunakan CSS atau gaya sebaris, anda boleh selaraskan kandungan sel jadual HTML anda dengan mudah, memberikan penampilan yang lebih profesional dan teratur.

Atas ialah kandungan terperinci Bagaimana untuk Menjajarkan Tengah Kandungan dalam Sel Jadual HTML?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan