(1)知識點
- (1.1)定義
- (1.2)包含的內容
- (1.3)如何使用
- (1.4)注意事項
(2)細化
(2.1)定義
什么是 Bootstrap
Bootstrap 是一個用于快速開發(fā) Web 應用程序和網站的前端框架。
移動設備優(yōu)先:自 Bootstrap 3 起,框架包含了貫穿于整個庫的移動設備優(yōu)先的樣式。
所有的主流瀏覽器都支持 Bootstrap。
Bootstrap 的響應式 CSS 能夠自適應于臺式機、平板電腦和手機。
它為開發(fā)人員創(chuàng)建接口提供了一個簡潔統一的解決方案;包含了功能強大的內置組件,易于定制;還提供了基于 Web 的定制;并且還是開源的。
(2.2)包含的內容
基本結構:Bootstrap 提供了一個帶有網格系統、鏈接樣式、背景的基本結構
CSS:Bootstrap 自帶以下特性:全局的 CSS 設置、定義基本的 HTML 元素樣式、可擴展的 class,以及一個先進的網格系統。
組件:Bootstrap 包含了十幾個可重用的組件,用于創(chuàng)建圖像、下拉菜單、導航、警告框、彈出框等等。
JavaScript 插件:Bootstrap 包含了十幾個自定義的 jQuery 插件。您可以直接包含所有的插件,也可以逐個包含這些插件。
定制:您可以定制 Bootstrap 的組件、LESS 變量和 jQuery 插件來得到您自己的版本。
(2.3)如何使用
關于如何使用,w3cshool上面講解的很清晰,可以根據步驟進行。
如何使用
(2.4)注意事項
(1)Bootstrap使用的是jquery的2.1.4版本,這個版本在IE8下會報錯,導致Bootstrap的js插件不能執(zhí)行。查看Bootstrap官網,采用的是:
<script>window.jQuery || document.write('<script src="js/jquery.min.js"><\/script>')</script>
不支持高版本的jquery庫就采用這個低版本庫,在IE8下雖然會報錯,但呈現效果是正常的。
或者可以直接使用jquery1.x版本的庫,不需要做兼容處理。
(2)HTML5 Shim 和 Respond.js 用于讓 IE8 支持 HTML5元素和媒體查詢
注意: 如果通過 file:// 引入 Respond.js 文件,則該文件無法起效果
<!--[if lt IE 9]>
<script src="https://.../html5shiv.js"></script>
<script src="https://.../respond.min.js"></script>
<![endif]-->