洛奇的邪惡組織手札

本章節的 Components 元件算是資訊量很大的單元，但也不用特別去背，只要知道有哪些功能可以選（複製貼上大法）加以利用去點綴你的網頁即可。

本章節分為兩節介紹分別是 Content 內容與 Utilities 通用。這些都比較偏向基礎或常用的 class 公式使用度偏高。完整學習這些後，靜態設計 Bootstrap 就算學的七八成了（可以出門騙吃騙吃）。

本系列根據教材課程需要進行 Bootstrap 套件的教學文章，在接觸 Bootstrap 之前需要擁有一定的 HTML5/CSS3 觀念，才能理解 Bootstrap 的原理應用以及調整技巧，如果你另具備了 JS/JQ 的開發能力，那更方便進一步的使用並控制這些 Bootstrap 套件工具。筆者這裡 Boostrap 的系列文章都來自官方本身提供的 Document 教學資料重新進行重新解析與翻譯重組解釋（也包含閹割一些覺得非必要的資訊），如果你擁有有足夠的能力可直接閱讀官方手冊並動手實作就不需要特地參閱已整理過的中文 BS 教學，動手跟著官方文件做操作練習才是最佳的經驗累積。

本篇一開始會介紹基本安裝環境，接著先介紹核心的版面規劃（將牽扯到 Grid 與 flexbox)。

CSS 的最後一篇基本課程，收錄一些偏於動態或視覺效果的 CSS 屬性，也提及到 CSS 動畫與轉場的動態播放，以及跨平台十分重要的 Media Query 媒體查詢。這些都算是能讓 CSS 更生動豐富且靈活，使網頁體驗上更有感受。

本篇進入跟版面調整有關的技巧章節，Float 是很常見的浮動觀念，接著佈局章節會提供一些例子進行設計，最後是非常重要且主流的 flexbox 觀念。也就是網頁排版的重點都包含在這篇文章了。另外其實還有 Grid 跟 RWD 部分將之後由 Bootstrap 去深入學習。

若順著教材讀到這裡，你會發現很多 CSS 的控制成敗都跟 block 或 inline 有關。這裡我們會完整介紹什麼是盒子模型 (Block & Inline)，有了完整的盒子概念後，就能接著會介紹如何去定位這些元素到指定的位置，學完這篇能幫助你整個 CSS 切版功力大幅提升。

歡迎來到 CSS 教材的第二篇共五篇。除了第一篇屬於入門需要介紹 CSS 公式與使用方法，之後開始都是全部都討論屬性值的控制。可以根據方向性規劃出不同的領域介紹，第二篇都是一些很基礎的 CSS 屬性值，隨著後續章節越來越高階應用。

CSS 的課程教材一共分為五篇章節文章介紹，都是基礎的從零開始的課程並跟隨 CSS3 的觀念技巧，完全沒學過的人可以跟著學習，曾碰過 CSS 的人也可以跳著章節選擇性參考。CSS 是很基本的技術一定要會，任何的排版與外觀技巧都是透過 CSS 完成。學會 CSS 能幫助你在任何 Web 平台（部落格、套版、框架主題、架站包…等等）上做輕度的視覺修改，更厲害的人可以進入設計師領域。

這是給新手 0 程度的 HTML 的基礎教材，如果你有一定的 HTML 概念與標籤觀念，則可跳過本篇。