今天敲代碼的時候,正好碰到這個問題. 與大家分享這個解決方法: 1/7 到bootstrap官方網站下載,對於我們開發者來說,直接下載編譯和壓縮後的CSS、JavaScript文件,另外還包含字體文件,但是不包含文檔和源碼文件。打開解壓包之後可以發現包含三個文件夾 css、fonts、js。這是最基 ...
今天敲代碼的時候,正好碰到這個問題.
與大家分享這個解決方法:
1/7
到bootstrap官方網站下載,對於我們開發者來說,直接下載編譯和壓縮後的CSS、JavaScript文件,另外還包含字體文件,但是不包含文檔和源碼文件。打開解壓包之後可以發現包含三個文件夾 css、fonts、js。這是最基本的Bootstrap組織形式:未壓縮版的文件可以在任意web項目中直接使用。我們提供了壓縮(bootstrap.min.*)與未壓縮 (bootstrap.*)的CSS和JS文件。字體圖標文件來自於Glyphicons
2/7
所有Bootstrap插件都依賴jQuery。而且在正式的項目當中我們推薦使用壓縮之後的版本,因為它的體積很小,到官網下載jQuery支持,如圖:
3/7
將下載後的就jQuery放到bootstrap中的js目錄下,如圖:
4/7
在bootstrap的根目錄下新建一個demo.html文件,(註意,必須在根目錄下麵新建,因為後面的步驟中要將bootstrap框架中的css和js文件鏈接到創建的demo中)
5/7
編輯demo.html文件,添加對bootstrap框架中css和js的引用,內容如下,圖片有註釋說明,這樣,我們就基本上建立了對bootstrap框架的基本使用架構
6/7
另外,bootstrap官方提供了鏈接服務,永久免費,即使你不下載bootstrap框架文件到本地,也可以直接在html中使用,使用下麵這段代碼:
<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>