Bootstrap實戰（簡體書）

前 言
為什么要寫這本書
Boostrap是Twitter公司開發的一個基于HTML、CSS和JavaScript的技術框架，集合了最新的前端技術，為實現Web應用程序快速開發提供了一套前端工具包，包括布局、柵格、表格、按鈕、表單、導航、提示等。使用Bootstrap可以構建出非常優雅的前端界面，且占用資源非常少。
Bootstrap是目前非常流行的前端開發工具包，具有以下特色：
由業內權威專家開發。Twitter是互聯網領域的技術先驅，引領時代技術潮流，Twitter前端開發團隊是公認的最棒的團隊之一，整個Bootstrap項目由經驗豐富的工程師和設計師奉獻。
擁有龐大的用戶基礎和實踐基礎，值得信賴。
學習和應用門檻比較低，適合各種技術水平的人。
跨設備、跨瀏覽器，為移動開發提供了平穩的開發平臺。
提供12列柵格布局，使網頁布局變得很簡單。
支持響應式設計，滿足不同設備的顯示需求。
樣式化的文檔，使學習和參考變得直觀、方便。
開放式代碼庫，使Bootstrap成為眾多業內好手展示的舞臺，也極大豐富了Bootstrap代碼庫。
與jQuery完美融合，可定制jQuery插件。
選用LESS構建動態樣式，使動態樣式開發成為可能，降低了時間成本，卻可以編寫更快、更靈活的CSS樣式表。
支持HTML5標簽和語法，要求在HTML5文檔類型基礎上進行設計和開發。
支持CSS3所有屬性和標準，逐步改進組件以達到最終效果。
Bootstrap始于2011年8月，至今才剛滿兩年，但是Bootstrap旋風卻已刮遍了整個互聯網。各種較小的網站就不提了，國內外很多較有名的網站也采用了Bootstrap。對于設計能力不強也沒有太多時間去設計前端界面的用戶來說，Bootstrap價值巨大。Bootstrap的目的就是幫助開發人員快速開發原型，避免經常從零開始繪制白底黑邊的裸圖。
Bootstrap框架提供一級的視覺效果，且應用視覺效果是一致的，這一點其實是很難實現的。使用Bootstrap可以確保整個Web應用程序的風格完全一致，用戶體驗一致，操作習慣一致。如果希望整個網站的鏈接、按鈕、提醒都有統一的視覺效果，那就應該毫不猶豫地選擇Bootstrap，此外它還可以對不同級別的提醒使用不同的顏色。
快速應用，簡單而優雅，Bootstrap會讓Web應用程序看起來與Windows或GNOME下的程序一樣，按鈕一樣，對話框一樣，運行快速。越來越多的Web應用程序被直接放在桌面上運行，應用的一致性是趨勢，開發人員可以把精力放在業務上，而不是UI設計上。
本書主要內容和特色
本書系統講解Bootstrap技術的體系結構、基礎知識、基本用法，以及各種深度應用。它不是一本語法書，也不是技術全能書，不會告訴讀者怎么編寫HTML、CSS和JavaScript代碼，但它會告訴讀者如何駕馭Bootstrap，讓Bootstrap成為你的設計寶典、你的前端開發基地。在此基礎上，讀者可以拓展個人插件，讓設計成為一種分享和積累。
簡單來說，本書具有如下幾個特點（也許這些特點并不都適合你，但是只要滿足一條或幾條，那么閱讀本書或者把本書作為參考都是很合適的）：
快速上手。Bootstrap是一個比較復雜的前端技術框架，對于基礎薄弱的讀者來說，初步使用Bootstrap會面臨很多困難和障礙。本書從下載Bootstrap框架開始，手把手地說明和演示，幫助讀者快速上手，旨在教會讀者正確使用Bootstrap，并應用Bootstrap所提供的全部功能。
扎實全面。Bootstrap是HTML、CSS和JavaScript技術框架，使用時應具備一定的基礎才能夠活學活用。本書知識點和技能點兼顧，系統而全面，確保讀者在無基礎的前提下能夠輕松閱讀、順暢理解、心領神會。
深入解碼。本書對于Bootstrap的剖析不僅關注知識面的系統，更強調技術的深度，特別是Bootstrap插件技術的開發；不僅對Bootstrap內部插件進行深入講解和剖析，還對插件的設計原理、途徑和方法進行解密，以幫助讀者用好Bootstrap插件，開發自己的Bootstrap插件。
下面就本書主要內容進行簡單說明和梳理。
第1章　為什么要學習Bootstrap
該章從知識角度重點介紹Bootstrap框架的前世今生，以及為什么要學習Bootstrap，如何開始學習等。
第2章　使用Bootstrap的準備
該章重點介紹如何使用Bootstrap，從下載Bootstrap框架、了解Bootstrap工具包類型和內部構成，到如何在頁面中正確使用Bootstrap，手把手幫你實現第一個Bootstrap開發示例。
第3章　Bootstrap框架解析
Bootstrap框架主要由動態CSS語言編寫，經過Node.js編譯后，Bootstrap就是眾多CSS的合集。該章就Bootstrap框架進行探索，以期幫助讀者掌握該框架的基本實現方式和設計思路，主要包括全局樣式表、柵格系統、Bootstrap布局、響應式設計等核心內容。
第4章　優化CSS樣式
CSS本身沒有可優化的，但是瀏覽器解析的默認標簽樣式卻不敢恭維。Bootstrap對常用標簽樣式進行優化，使其更耐看，更精致。Bootstrap的基礎CSS（Base CSS）提供了優雅、一致的多種基礎HTML頁面要素，包括排版、表格、表單、按鈕等，能夠滿足前端工程師的基本設計需求。
第5章　CSS動態樣式——LESS
LESS是一種半自動化的動態語言，它使CSS具備了初步編程的能力，在CSS的語法基礎之上，引入了變量、混合、運算和函數等特性，大大提升了CSS動態開發能力，降低了CSS的維護成本。就像它的名稱所表達的意思，LESS可以讓我們用更少的代碼做更多的事情。
第6章　使用Bootstrap組件
Bootstrap作為完整的前端工具集，內建了大量強大、優雅且可重用的組件。該章詳細介紹按鈕（button）、導航（navigation）、標簽（label）、徽章（badge）、排版（typography）、縮略圖（thumbnail）、提醒（alert）、進度條（progress bar）、雜項（miscellaneous）組件的結構和基本應用。
第7章　使用Bootstrap插件
Bootstrap自帶了13個JavaScript插件，這些插件為Bootstrap組件賦予了生命，因此用戶在學習使用Bootstrap組件的同時，還必須學習使用Bootstrap插件。該章將詳細介紹這些插件的使用技法。
第8章　Bootstrap擴展
雖然Bootstrap自帶很多JavaScript插件，但是一些常用的控件卻沒有，如Datepicker等。該章將介紹幾款比較流行的Bootstrap擴展插件，幫助讀者認識如何設計和使用Bootstrap外部插件，以彌補Bootstrap的不足之處。
第9章　使用Bootstrap快速開發社區分享網站
該章中的示例構建的主題是一個基本單詞分享的學習型網站，旨在幫助讀者學習如何用Bootstrap制作自己的響應式社區網站。Bootstrap是一個響應式框架，用它創建一個響應式Web應用程序將是一個偉大的起點。
第10章　Bootstrap內核解碼
該章從Bootstrap應用階段上升到源碼分析階段，幫助讀者掌握Bootstrap設計原理，為Bootstrap二次開發打好基礎。
讀者對象
本書適合以下讀者閱讀：
打算學習DIV+CSS的設計人員。
打算學習JavaScript的開發人員。
有意提升自己網站設計水平和Web應用程序開發能力的Web開發人員。
希望全面深入理解Bootstrap框架的初學者。
沒有UI設計經驗的程序員。
希望快速搭建界面的網頁設計人員。
此外，本書也適合熟悉下列相關技術的讀者閱讀：
PHP/ASP/JSP
jQuery
AJAX
HTML/XML
CSS
JavaScript
對于沒有計算機基礎知識的初學者，以及只想快速搭建網站UI和交互功能的讀者，閱讀本書前建議先閱讀HTML、CSS和JavaScript基礎教程類圖書。
如何閱讀本書
“工欲善其事，必先利其器”，在“善其事”之前，要先檢查“器”是否已經磨得足夠鋒利，是否能夠在前進的道路上披荊斬棘。無論將來的職業發展方向是架構師、設計師、分析師、管理者，還是其他職位，只要與Web設計打交道，就有必要打好技術基礎。本書涉及的是核心的Bootstrap框架技術，如果能全部理解并付諸實踐，一定可以提升讀者的Web設計和開發水平。
要用好本書，讀者應當準備一些HTML基礎知識，如果熟悉CSS樣式，將更容易理解一些設計規則。由于Bootstrap是一個前端綜合技術框架，因而如果讀者希望系統掌握Bootstrap，并開發自己的Bootstrap插件，則應該掌握JavaScript語言基礎；如果僅僅是為了用好Bootstrap，則可以不考慮。
資源和勘誤
本書編寫過程中得到了以下人員的幫助：馬本連、吳建華、江淑軍、李斌、李經鍵、鄭偉、田蜜、陸穎、王慧明、張煒、陳銳、王幼平、楊龍貴、蘇震巍、崔鵬飛等，非常感謝他們。由于作者的水平有限，加之編寫時間倉促，書中難免會出現一些錯誤或不準確的地方，懇請讀者批評指正。書中的全部源文件可以從華章網站（www.hzbook.com）下載。如果您有任何意見和建議，歡迎發送郵件至郵箱js_code@126.com，期待得到您的真誠反饋。
致謝
感謝機械工業出版社華章公司策劃編輯楊福川在這一年多的時間中始終支持我的寫作，他的鼓勵和幫助讓我順利完成了本書。
最后感謝我的父母，感謝他們的養育之恩，感謝他們時時刻刻給我信心和力量！
謹以此書獻給我最愛的家人，以及眾多熱愛網頁設計的朋友們！

成林