我們將假設您已經熟悉HTML和CSS的基本原理這門課開始之前。如果您不熟悉這些主題,我們建議閱讀我們的HTML和CSS教程。

下載引導:

https://getbootstrap.com/,你可以引導的最新版本。當你點擊這個鏈接,你會采取如下所示的屏幕。

下麵你將看到兩個按鈕:

• 下載引導——你可能下載預編譯並引導CSS的縮小版本,點擊這個JavaScript和字體。沒有文件或源代碼文件包括在內。
• 下載來源:你可以抓住當前引導少和JavaScript源代碼直接從GitHub通過點擊這個。

在課上,我們將使用一個預編譯的版本的引導更好的理解和使用方便。你不必擔心為個人提供不同的文件功能,因為文件編譯和縮小。最新版本(引導3)當時下載本教程的編寫。

文件結構:

預編譯的引導:一旦你引導的構建版本,下載解壓ZIP文件披露下列文件/目錄結構。

有編製的CSS和javascript(引導。*)和編譯和縮小CSS和javascript (bootstrap.min。*),正如你所看到的。提供可選的引導主題,Glyphicons字體。

引導程序源代碼:

如果你下載了引導程序源代碼,下麵是文件結構:

• 引導程序的源代碼CSS、JS和圖標字體可能發現少/,/ JS /,和字體文件夾(分別)。
• 一切都顯示在上麵的預編譯下載部分在dist /文件夾。
• 引導文檔可能會發現在docs-assets /, /例子,所有*。html文件。

HTML模板:

一個基本的HTML模板使用引導:

< !DOCTYPE html > < html > <頭> <標題>引導101模板< /名稱> < meta name = " viewport " content = " width =設備寬度,初始= 1.0 " > < !-引導- > < css / bootstrap.min href = "鏈接。css樣式表“rel = > < !——HTML5墊片和回應。js IE8支持HTML5元素和媒體查詢- - > < !——警告:回應。js不工作如果你查看頁麵通過文件:/ / - - > < !——(如果lt IE 9) > < script src = " https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js " > < /腳本> < script src = " https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js " > < /腳本> < !(endif) - - > < /頭> <身體> < h1 >你好,世界!< / h1 > < !——jQuery(引導所需的JavaScript插件)- - > < script src " https://code.jquery.com/jquery.js " > < /腳本> < !——包括所有編譯插件(下圖),或者根據需要包括單個文件- - > < script src = " js / bootstrap.min。js " > < /腳本> < /身體> < / html >

jquery。js, bootstrap.min。js和bootstrap.min。css文件中包含引導模板來創建一個常規的HTM文件。隻是確保你包括jQuery庫前引導圖書館。

在引導CSS章概述,進一步的信息在每個部分在前麵的代碼將被提供。