Tabel Dasar:
<able> <tr> <td> Nama pengguna </td> <td> kata sandi </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </able>
Menambahkan kelas .table ke tag <table> dapat memberikannya gaya dasar, sejumlah kecil bantalan dan pembagi horizontal.
Efek tampilan adalah sebagai berikut:
Bentuk bergaris:
Menambahkan: class = "Tabel-striped" ke tag tabel dapat menambahkan garis zebra ke setiap baris di dalam tbody
<able> <tr> <td> Nama pengguna </td> <td> kata sandi </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </able>
Efek tampilan adalah sebagai berikut:
Tabel dengan perbatasan:
Tambahkan class = "Table-Table-Bordered" ke tag tabel untuk menambahkan batas ke setiap sel tabel.
<able> <tr> <td> Nama pengguna </td> <td> kata sandi </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </able>
Efek tampilan adalah sebagai berikut:
Formulir Pengetatan:
Menambahkan kelas .table-condensed dapat membuat tabel lebih kompak, dan bantalan dalam sel akan dikurangi setengahnya.
<able> <tr> <td> Nama pengguna </td> <td> kata sandi </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </able>
Efek tampilan adalah sebagai berikut:
Tabel Responsif:
Bungkus elemen .table Tabel dalam elemen .table-responsive dan buat tabel responsif yang menggulir secara horizontal pada perangkat layar kecil (kurang dari 768px). Saat layar lebih besar dari lebar 768px, bilah gulir horizontal menghilang
<div> <ableb> <tr> <td> Nama pengguna </td> <td> kata sandi </td> </tr> <tr> <td> ahhh </td> <td> 1111 </td> </tr> </able> </div>
Di atas adalah deskripsi lengkap dari pengenalan gaya bentuk bootstrap keenam yang diperkenalkan oleh editor. Saya harap ini akan membantu semua orang. Jika Anda memiliki pertanyaan, silakan tinggalkan saya pesan dan editor akan membalas semua orang tepat waktu. Terima kasih banyak atas dukungan Anda ke situs web Wulin.com!