Bagaimana untuk Mencapai Penjajaran Teks dalam Jadual Bootstrap?

Penjajaran Teks dalam Rangka Kerja Bootstrap

Pengenalan:

Jadual ialah elemen biasa yang digunakan untuk mempersembahkan data dalam format berstruktur. Menjajarkan teks dalam sel jadual adalah penting untuk kebolehbacaan dan menambah baik persembahan keseluruhan. Panduan ini memberikan cerapan tentang menggunakan rangka kerja Bootstrap Twitter untuk mencapai penjajaran teks dalam jadual.

Bootstrap 3:

Bootstrap 3 menawarkan kelas penjajaran teks yang mudah:

• teks-kiri: Menjajarkan teks ke kiri.
• teks-pusat: Memusatkan teks secara mendatar.
• teks -kanan: Menjajarkan teks ke kanan.
• text-justify: Mewajarkan teks untuk mengisi ruang yang tersedia sama rata.
• text-nowrap: Menghalang teks daripada membalut, mengekalkan satu baris.

Sebagai contoh, untuk menjajarkan pengepala jadual untuk jumlah nilai ke kanan:

<th><span class="align-right">Total</span></th>

Untuk menjajarkan sel data jadual yang sepadan di sebelah kanan:

<td><span class="align-right">,000,000.00</span></td>

Bootstrap 4 dan Bootstrap 5:

Dalam Bootstrap 4 dan 5, kelas penjajaran teks telah dikembangkan, memberikan kawalan yang lebih berbutir:

• .text-start: Menjajarkan teks ke kiri dalam bahasa LTR (kiri-ke-kanan) dan ke kanan dalam RTL (kanan-ke- kiri) bahasa.
• .text-center: Memusatkan teks secara mendatar.
• .text-end: Menjajarkan teks ke kanan dalam bahasa LTR dan ke kiri dalam bahasa RTL.

Selain itu, Bootstrap 4 dan 5 memperkenalkan kelas penjajaran teks responsif, membolehkan penjajaran berbeza pada saiz port pandangan yang berbeza. Contohnya, untuk menjajarkan teks ke kanan pada port pandangan yang besar dan lebih besar:

<p class="text-lg-right text-xl-right">Right aligned text on large and extra-large viewports.</p>

Atas ialah kandungan terperinci Bagaimana untuk Mencapai Penjajaran Teks dalam Jadual Bootstrap?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!