Perluas Bootstrap untuk memanfaatkan gaya dan komponen yang disertakan, serta variabel dan mixin KURANG.
Bootstrap dibuat dengan KURANG pada intinya, bahasa stylesheet dinamis yang dibuat oleh teman baik kami, Alexis Sellier . Itu membuat pengembangan CSS berbasis sistem lebih cepat, lebih mudah, dan lebih menyenangkan.
Salah satu pembuat Bootstrap menulis posting blog singkat tentang ini , dirangkum di sini:
Sebagai perpanjangan dari CSS, KURANG menyertakan variabel, mixin untuk potongan kode yang dapat digunakan kembali, operasi untuk matematika sederhana, bersarang, dan bahkan fungsi warna.
Kunjungi situs web resmi di http://lesscss.org/ untuk mempelajari lebih lanjut.
Karena CSS kami ditulis dengan Less dan menggunakan variabel dan mixin, CSS perlu dikompilasi untuk implementasi produksi akhir. Begini caranya.
Ikuti instruksi dalam readme proyek di GitHub untuk kompilasi melalui baris perintah.
Unduh Less.js terbaru dan sertakan jalurnya (dan Bootstrap) di file <head>
.
<link rel = "stylesheet/less" href = "/path/to/bootstrap.less" > <script src = "/path/to/less.js" ></script>
Untuk mengkompilasi ulang file .less, simpan saja dan muat ulang halaman Anda. Less.js mengkompilasinya dan menyimpannya di penyimpanan lokal.
Aplikasi Mac tidak resmi mengawasi direktori file .less dan mengkompilasi kode ke file lokal setelah setiap penyimpanan file .less yang ditonton. Jika mau, Anda dapat beralih preferensi di aplikasi untuk pengecilan otomatis dan direktori tempat file yang dikompilasi berakhir.
Crunch adalah editor dan kompiler KURANG yang tampak hebat yang dibangun di atas Adobe Air.
Dibuat oleh orang yang sama dengan aplikasi Mac tidak resmi, CodeKit adalah aplikasi Mac yang mengkompilasi KURANG, SASS, Stylus, dan CoffeeScript.
Aplikasi Mac, Linux, dan Windows untuk drag and drop kompilasi file KURANG. Plus, kode sumbernya ada di GitHub .
Mulai proyek web apa pun dengan cepat dengan memasukkan CSS dan JS yang dikompilasi atau diperkecil. Lapisi gaya khusus secara terpisah untuk peningkatan dan pemeliharaan yang mudah di masa mendatang.
Unduh Bootstrap terkompilasi terbaru dan tempatkan ke dalam proyek Anda. Misalnya, Anda mungkin memiliki sesuatu seperti ini:
aplikasi/ tata letak/ templat/ publik/ css/ bootstrap.min.css js/ bootstrap.min.js img/ glyphicons-halflings.png glyphicons-halflings-white.png
Salin HTML dasar berikut untuk memulai.
- <html>
- <kepala>
- <title> Template Bootstrap 101 </title>
- <!-- Bootstrap -->
- <link href = "public/css/bootstrap.min.css" rel = "stylesheet" >
- </head>
- <tubuh>
- <h1> Halo, dunia! </h1>
- <!-- Bootstrap -->
- <script src = "public/js/bootstrap.min.js" ></script>
- </tubuh>
- </html>
Bekerja di CSS kustom Anda, JS, dan lainnya yang diperlukan untuk membuat Bootstrap Anda sendiri dengan file CSS dan JS Anda sendiri yang terpisah.
- <html>
- <kepala>
- <title> Template Bootstrap 101 </title>
- <!-- Bootstrap -->
- <link href = "public/css/bootstrap.min.css" rel = "stylesheet" >
- <!-- Proyek -->
- <link href = "public/css/application.css" rel = "stylesheet" >
- </head>
- <tubuh>
- <h1> Halo, dunia! </h1>
- <!-- Bootstrap -->
- <script src = "public/js/bootstrap.min.js" ></script>
- <!-- Proyek -->
- <script src = "public/js/application.js" ></script>
- </tubuh>
- </html>