通過Bower安裝并管理Bootstrap的Less、CSS昌简、Javascript和字體文件
$ bower install boostrap
通過npm進(jìn)行安裝Bootstrap
$ npm install bootstrap
require('bootstrap')加載Bootstrap的所有jQuery插件遇八。
也可通過加載安裝包頂級目錄下的/js/*.js文件的方式手動加載單個的Bootstrap插件。
通過Composer進(jìn)行安裝
$ composer require twbs/bootstrap
編譯Less/Sass源碼需要注意的事項(xiàng)栅屏。
Bootstrap利用Autoprefixer自動為某些CSS屬性添加針對特定廠商的前綴啸箫。
Bootstrap插件全部依賴jQuery耸彪。
Bootstrap使用Grunt作為編譯系統(tǒng)伞芹,并且對外提供了一些方便的方法用于編譯整個框架忘苛。
安裝Grunt
首先下載安裝node.js。然后在命令行中輸入以下命令:
- 在全局環(huán)境中安裝grunt-cli: npm install -g grunt-cli
- 進(jìn)入/bootstrap/根目錄唱较,然后執(zhí)行npm install命令安裝所有依賴包扎唾。
然后就可以使用Grunt命令了。
grunt dist(僅編譯CSS和JavaScript文件)
重新生成/dist/目錄
grunt watch(檢測文件的改變南缓,并運(yùn)行指定的Grunt任務(wù))
檢測Less源碼文件的改變胸遇,并自動重新將其編譯為CSS文件。
grunt test(運(yùn)行測試用例)
在PhantomJS環(huán)境中運(yùn)行JSHint和QUnit自動化測試用例汉形。
grunt docs(編譯并測試文檔中的資源文件)
grunt(重新建構(gòu)所有內(nèi)容并運(yùn)行測試用例)
為了讓IE8支持HTML5元素和媒體查詢纸镊,需要引入html5shiv.min.js和respond.min.js
Respond.js在file://下觀看是無效的。
禁止響應(yīng)式布局有如下幾步:
- 移除此CSS文檔中提到的設(shè)置瀏覽器視口(viewport)的標(biāo)簽:<meta>
- 通過為.container類設(shè)置一個width值從而覆蓋框架的默認(rèn)width設(shè)置概疆,
例如width: 970px !important;確保這些設(shè)置全部放在默認(rèn)的Bootstrap CSS文件的后面逗威。
3.如果使用了導(dǎo)航條,需要移除所有導(dǎo)航條的折疊和展開行為岔冀。
4.對于柵格布局凯旭,額外增加了.col-xs-類或替換掉.col-md-和.col-lg-*。