Bagaimana untuk Menetapkan Lebar Tetap untuk Elemen dalam Jadual HTML Menggunakan Bootstrap?

Membetulkan Lebar untuk dalam HTML

Menetapkan lebar tetap untuk sel data jadual () ialah keperluan penggayaan biasa. Walau bagaimanapun, ia boleh menjadi mencabar untuk mencapai ini dan anda mungkin telah mencuba pelbagai pendekatan tanpa berjaya.

Bootstrap 4.0

Malangnya, dalam Bootstrap 4.0.0, anda tidak boleh menggunakan kelas col-* (kerana ia hanya berfungsi dalam Firefox, bukan Chrome). Sebaliknya, anda perlu menggunakan penyelesaian berikut:

<tr>
  <th>

Bootstrap 3.0

Dalam Bootstrap 3.0, anda boleh menggunakan "col-md-" kelas, dengan "" mewakili bilangan lajur lebar anda mahu.

<tr>
    <td class="col-md-2">A</td>
    <td class="col-md-3">B</td>
    <td class="col-md-6">C</td>
    <td class="col-md-1">D</td>
</tr>

Bootstrap 2.0

Untuk Bootstrap 2.0, gunakan kelas "span*", mengikut corak yang sama seperti Bootstrap 3.0.

<tr>
    <td class="span2">A</td>
    <td class="span3">B</td>
    <td class="span6">C</td>
    <td class="span1">D</td>
</tr>

Penting Nota

Jika anda mempunyai elemen dalam jadual anda, pastikan anda menetapkan lebar pada elemen dan bukan pada elemen. Ini kerana elemen mewarisi lebarnya daripada induk elemen.

Atas ialah kandungan terperinci Bagaimana untuk Menetapkan Lebar Tetap untuk Elemen dalam Jadual HTML Menggunakan Bootstrap?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!