Lewati ke konten utama Lewati ke navigasi dokumen
Check
in English

Sesuaikan

Pelajari cara membuat tema, menyesuaikan, dan memperluas Bootstrap dengan Sass, banyak pilihan global, sistem warna yang luas, dan banyak lagi.

Kelancangan Manfaatkan file Sass sumber kami untuk memanfaatkan variabel, peta, mixin, dan fungsi.
Pilihan Kustomisasi Bootstrap dengan variabel bawaan untuk dengan mudah beralih preferensi CSS global.
Warna Pelajari tentang dan sesuaikan sistem warna yang mendukung seluruh toolkit.
Komponen Pelajari bagaimana kami membangun hampir semua komponen kami secara responsif dan dengan kelas dasar dan pengubah.
variabel CSS Gunakan properti kustom CSS Bootstrap untuk desain dan pengembangan yang cepat dan berwawasan ke depan.
Optimalkan Jaga agar proyek Anda tetap ramping, responsif, dan dapat dipelihara sehingga Anda dapat memberikan pengalaman terbaik.

Ringkasan

Ada beberapa cara untuk menyesuaikan Bootstrap. Jalur terbaik Anda dapat bergantung pada proyek Anda, kompleksitas alat build Anda, versi Bootstrap yang Anda gunakan, dukungan browser, dan banyak lagi.

Dua metode pilihan kami adalah:

  1. Menggunakan Bootstrap melalui manajer paket sehingga Anda dapat menggunakan dan memperluas file sumber kami.
  2. Menggunakan file distribusi terkompilasi Bootstrap atau jsDelivr sehingga Anda dapat menambahkan atau mengganti gaya Bootstrap.

Meskipun kami tidak dapat masuk ke detail di sini tentang cara menggunakan setiap manajer paket, kami dapat memberikan beberapa panduan tentang penggunaan Bootstrap dengan kompiler Sass Anda sendiri .

Bagi mereka yang ingin menggunakan file distribusi, tinjau halaman memulai untuk mengetahui cara memasukkan file tersebut dan contoh halaman HTML. Dari sana, lihat dokumen untuk tata letak, komponen, dan perilaku yang ingin Anda gunakan.

Saat Anda membiasakan diri dengan Bootstrap, lanjutkan menjelajahi bagian ini untuk detail lebih lanjut tentang cara memanfaatkan opsi global kami, memanfaatkan dan mengubah sistem warna kami, bagaimana kami membangun komponen kami, cara menggunakan daftar properti kustom CSS kami yang terus bertambah, dan bagaimana untuk mengoptimalkan kode Anda saat membangun dengan Bootstrap.

CSP dan SVG tersemat

Beberapa komponen Bootstrap menyertakan SVG yang disematkan di CSS kami untuk menata komponen secara konsisten dan mudah di seluruh browser dan perangkat. Untuk organisasi dengan konfigurasi CSP yang lebih ketat , kami telah mendokumentasikan semua contoh SVG tersemat kami (semuanya diterapkan melalui background-image) sehingga Anda dapat meninjau opsi Anda secara lebih menyeluruh.

Berdasarkan percakapan komunitas , beberapa opsi untuk mengatasi hal ini di basis kode Anda sendiri termasuk mengganti URL dengan aset yang dihosting secara lokal , menghapus gambar dan menggunakan gambar sebaris (tidak mungkin di semua komponen), dan memodifikasi CSP Anda. Rekomendasi kami adalah meninjau dengan cermat kebijakan keamanan Anda sendiri dan memutuskan jalur terbaik ke depan, jika perlu.