Panjangkan Bootstrap untuk memanfaatkan gaya dan komponen yang disertakan, serta KURANG pembolehubah dan campuran.
Bootstrap dibuat dengan LESS pada terasnya, bahasa lembaran gaya dinamik yang dicipta oleh rakan baik kami, Alexis Sellier . Ia menjadikan pembangunan CSS berasaskan sistem lebih pantas, lebih mudah dan lebih menyeronokkan.
Salah seorang pencipta Bootstrap menulis catatan blog pantas tentang ini , diringkaskan di sini:
Sebagai lanjutan CSS, LESS termasuk pembolehubah, campuran untuk coretan kod yang boleh diguna semula, operasi untuk matematik mudah, sarang dan juga fungsi warna.
Lawati tapak web rasmi di http://lesscss.org/ untuk mengetahui lebih lanjut.
Memandangkan CSS kami ditulis dengan Kurang dan menggunakan pembolehubah dan campuran, ia perlu disusun untuk pelaksanaan pengeluaran akhir. Ini caranya.
Ikut arahan dalam projek readme pada GitHub untuk menyusun melalui baris arahan.
Muat turun Less.js terkini dan sertakan laluan kepadanya (dan Bootstrap) dalam <head>
.
<link rel = "stylesheet/less" href = "/path/to/bootstrap.less" > <script src = "/path/to/less.js" ></script>
Untuk menyusun semula fail .less, cuma simpan dan muat semula halaman anda. Less.js menyusunnya dan menyimpannya dalam storan setempat.
Apl Mac tidak rasmi menonton direktori fail .less dan menyusun kod ke fail tempatan selepas setiap menyimpan fail .less yang ditonton. Jika anda suka, anda boleh menogol pilihan dalam apl untuk pengecilan automatik dan direktori mana fail yang dikompilasi berakhir.
Crunch ialah penyunting dan pengkompil KURANG yang kelihatan hebat dibina pada Adobe Air.
Dicipta oleh lelaki yang sama seperti apl Mac tidak rasmi, CodeKit ialah apl Mac yang menyusun LESS, SASS, Stylus dan CoffeeScript.
Apl Mac, Linux dan Windows untuk seret dan lepas menyusun fail KURANG. Selain itu, kod sumber ada pada GitHub .
Mulakan mana-mana projek web dengan pantas dengan memasukkan CSS dan JS yang disusun atau diperkecil. Lapisan pada gaya tersuai secara berasingan untuk peningkatan mudah dan penyelenggaraan bergerak ke hadapan.
Muat turun Bootstrap terkumpul terkini dan letakkan ke dalam projek anda. Sebagai contoh, anda mungkin mempunyai sesuatu seperti ini:
aplikasi/ susun atur/ templat/ awam/ css/ bootstrap.min.css js/ bootstrap.min.js img/ glyphicons-halflings.png glyphicons-halflings-white.png
Salin HTML asas berikut untuk bermula.
- <html>
- <kepala>
- <title> Templat Bootstrap 101 </title>
- <!-- Bootstrap -->
- <link href = "public/css/bootstrap.min.css" rel = "stylesheet" >
- </head>
- <badan>
- <h1> Helo, dunia! </h1>
- <!-- Bootstrap -->
- <script src = "public/js/bootstrap.min.js" ></script>
- </body>
- </html>
Bekerja dalam CSS tersuai anda, JS dan banyak lagi yang perlu untuk menjadikan Bootstrap milik anda dengan fail CSS dan JS anda yang berasingan.
- <html>
- <kepala>
- <title> Templat Bootstrap 101 </title>
- <!-- Bootstrap -->
- <link href = "public/css/bootstrap.min.css" rel = "stylesheet" >
- <!-- Projek -->
- <link href = "public/css/application.css" rel = "stylesheet" >
- </head>
- <badan>
- <h1> Helo, dunia! </h1>
- <!-- Bootstrap -->
- <script src = "public/js/bootstrap.min.js" ></script>
- <!-- Projek -->
- <script src = "public/js/application.js" ></script>
- </body>
- </html>