初識 Bootstrap

標籤：為什麼   開發效率   script   網頁   結構   直接   好的   不同   查詢   

Bootstrap 概述

　　Bootstrap 是一個前端架構，使用它可以快速開發響應式頁面，還能專門針對 PC 端或移動端快速開發，大大提高了開發效率。

　　Bootstrap 來自 Twitter，是目前最流行的前端架構。它是基於 HTML、CSS、JavaScript 的一個簡潔、靈活的開源架構。 

　　1、 為什麼要使用 Bootstrap　　當需要製作響應式的網頁來適配各種終端，我們通過媒體查詢，針對要適配的每種終端都得設定相應的樣式甚至是改變網頁結構，而且開發和維護起來也很麻煩。而 Bootstrap 庫中包含很多現成的帶有各種樣式和功能的程式碼片段，這些代碼可以為你的網站增加更多活力，Web 開發人員不必再花費時間、花費精力地編碼，只需要找到合適的代碼，插入到合適的位置即可。最主要的是這些程式碼片段是經過封裝的，可以適用於不同的終端裝置，無論是在 PC 瀏覽器中還是平板電腦、手機等，都能很好地瀏覽網頁。

　　Bootstrap 架構裡的一些效果是使用 HTML5 和 CSS3 開發的，我們都知道 CSS3 有的屬性是有相容性的。 Twitter 當初開發該工具的時候，就考慮到瀏覽器間表現不一致的情況，所以 Bootstrap 已經對此做了相容處理，保證了介面在不同平台上的統一性。在 IE、Chrome、Firefox 等瀏覽器中可以看到統一的介面。

　　目前使用較廣的是版本 2.0 和 3.0，我們以 3.0 版本進行講解。因為從版本 3.0 開始 Bootstrap 移入移動先行的思想，使我們能使用它快速開發移動項目。在 Bootstrap 3.0 中重寫整個架構，使其一開始就是對行動裝置友好的。這次不是簡單地增加一些可選的針對行動裝置的樣式，而是直接融合進了架構的核心中。

　　2、Bootstrap 使用情境
　　Bootstrap 是最受歡迎的 HTML、CSS 和 JavaScript 架構，用於開發響應式布局、行動裝置優先的 Web 項目。這是 Bootstrap 的核心理念，從中也可以看出 Bootstrap 的使用情境是製作適配各終端的響應式的頁面、製作行動裝置項目。

　　實際上 Bootstrap 是個 “萬能” 的架構，因為它不只是在上面的兩種情境才能使用，它整合了 CSS 樣式和 JavaScript 互動特效，只要是有網頁的地方都可以使用。

初識 Bootstrap