Bootstrap kelas tambahan
Bab ini membahas beberapa Bootstrap mungkin akan kelas pembantu berguna.
teks
Berikut kelas yang berbeda menunjukkan warna teks yang berbeda. Jika teks link untuk memindahkan mouse teks akan diredupkan:
kategori | deskripsi | contoh |
---|---|---|
.text-mute | Teks Style "text-diredam" kategori | mencoba |
.text-primer | Teks Style "text-primer" kategori | mencoba |
.text-sukses | Teks Style "text-sukses" kategori | mencoba |
.text-info | Teks Style "text-info" kategori | mencoba |
.text-peringatan | Teks Style "text-peringatan" kategori | mencoba |
.text-bahaya | Teks Style "text-bahaya" kategori | mencoba |
latar belakang
Berikut kelas yang berbeda menunjukkan warna latar belakang yang berbeda. Jika teks link untuk memindahkan mouse teks akan diredupkan:
kategori | deskripsi | contoh |
---|---|---|
BG-primer | Tabel sel menggunakan "bg-primer" kategori | mencoba |
BG-sukses | Tabel sel menggunakan "bg-sukses" kategori | mencoba |
BG-info | Tabel sel menggunakan "bg-info" kategori | mencoba |
BG-peringatan | Tabel sel menggunakan "bg-warning" kategori | mencoba |
BG-bahaya | Tabel sel menggunakan "bg-bahaya" kategori | mencoba |
lain
kategori | deskripsi | contoh |
---|---|---|
.pull-kiri | Elemen mengapung ke kiri | mencoba |
.pull-benar | Elemen mengapung ke kanan | mencoba |
.center-block | Elemen diatur display: block dan berpusat | mencoba |
.clearfix | jelas mengambang | mencoba |
.show | elemen wajib ditampilkan | mencoba |
.hidden | Wajib elemen bersembunyi | mencoba |
.sr-satunya | Selain pembaca layar, elemen tersembunyi pada perangkat lain | mencoba |
.sr-satunya-focusable | Dalam hubungannya dengan kelas .sr-satunya, ditampilkan ketika elemen mendapat fokus (seperti: operasi keyboard pengguna) | mencoba |
.text-hide | Halaman elemen teks yang terkandung mengganti background | mencoba |
.close | Tampilan Off | mencoba |
.caret | menu drop-down tampilan | mencoba |
contoh yang lebih
Tutup ikon
Gunakan umum Tutup ikon untuk menutup kotak modal dan kotak peringatan. Menggunakankelas dekat untuk mendapatkan ikon dekat.
contoh
Coba »
Hasilnya adalah sebagai berikut:
tanda sisipan
Gunakan tanda sisipan untuk menurunkan fungsi dan arah. Gunakan <span> elemen dengankelas sisipan untuk mendapatkan fitur ini.
Hasilnya adalah sebagai berikut:
cepat floating
Anda dapat menggunakan setiapkelas pull-kiri pull-kananatau ke elemen kiri atau kanan mengambang. Contoh berikut menggambarkan hal ini.
contoh
Coba »
Hasilnya adalah sebagai berikut:
Untuk menyelaraskan komponen panel navigasi, menggunakan.navbar-kiri atau .navbar-kanan,bukan. Lihat Bootstrap bar navigasi .
konten berpusat
Menggunakankelas pusat-blok ke pusat elemen.
contoh
Coba »
Hasilnya adalah sebagai berikut:
jelas mengambang
Untuk menghapus elemen mengambang, menggunakankelas .clearfix.
contoh
Coba »
Hasilnya adalah sebagai berikut:
Show dan menyembunyikan konten
Anda dapat memaksa elemen untuk menampilkan atau menyembunyikan (termasuk pembaca layar) melalui penggunaankelas .show dan .hiddendatang.
contoh
Coba »
Hasilnya adalah sebagai berikut:
pembaca layar
Anda bisa menyimpan semua elemen pada perangkat dengan menggunakankelas tersembunyi .sr-satunya, selain pembaca layar.
contoh
Coba »
Hasilnya adalah sebagai berikut:
Di sini kita melihat dua jenis tag masukan label dengankelas sr-satunya, sehingga label hanya akan terlihat oleh pembaca layar.