孤軍奮戰的您
常常遇到這些狀況嗎？
缺乏參與大型專案經驗與能力
想累積更多實力嗎？
被大量的專案需求輾壓
無法在時限完成需求？
網站架構與時俱進，
開發常常卡在過去嗎？
外人不懂的苦！
Bootstrap 增加工作效率打造堅強實力。
Bootstrap 是目前公認最流行的前端開發框架，內建多項模組化的版型、表單、按鈕等元件組合，能幫您省下大量的 UI 設計時間！
而透過 Bootstrap 設計出來的前端 UI，具有極高的兼容性，能完美呈現在以下裝置：
手機
平板
桌面電腦
學一套輕鬆解決跨裝置的問題！
超過百萬開發者使用！
Bootstrap 是您必會的網頁設計框架！
根據 Wappalyzer 統計，目前至少有 7,400,000 個網站使用 Bootstrap
在 Bootstrap 團隊不斷優化，以及眾多開發者的使用見證下，Bootstrap 以調校適用於各類型網頁服務下，無論是活動頁面、購物網站、控制台、行動版網頁一律適用。
讓您能用簡單的開發方式，提供大方、直覺好操作的 UI 體驗給所有人。
讓六角學院，帶您搶先攻略
Bootstrap 4
六角學院，是一所結合各項國際教學資源的線上學院，迄今已獲得57個國家、超過 10,000 名學員的教學好評。
我們致力於提供各項程式、網頁、設計等現代工程師、網頁設計師必備的專業課程。
面對全球最受矚目的網頁設計工具「Bootstrap 4」的重大升級，我們已先一步完成「 Bootstrap 4 中文手冊」，去除語言隔閡輕鬆學習 Bootstrap 4。
課程大綱
六角學院線上資源
Available in
days
days
after you enroll
課程概觀
Available in
days
days
after you enroll
快速上手 Bootstrap
Available in
days
days
after you enroll
基礎內容文件要點說明
Available in
days
days
after you enroll
Flex 、網格系統 及相關的排版概念
Available in
days
days
after you enroll
- 網格概念 (7:22)
- Bootstrap 中的欄與列 (9:57)
- Bootstrap 中的響應式中斷點 (9:49)
- 欄與欄寬 (3:26)
- 課程名稱調整說明
- CSS3 Flex 的重要觀念（非常重要） (7:14)
- Bootstrap 通用類別與 Flex（好用） (9:48)
- Container 觀念（好用） (3:21)
- Bootstrap Flex 補充說明（好用） (5:01)
- 通用類別中的 Spacing 妙用 (7:41)
- 範例：元件與 Grid 的關係 (4:13)
- 範例：使用 Grid 製作相簿排版 (9:15)
- 範例：使用 Grid 製作時間軸的排版 (9:47)
- 範例：使用 Grid 製作時間軸的排版-課程補充
- 結語：本章很重要，請多多練習 (1:16)
- 網格系統章節測驗
Bootstrap 通用類別 (Utilities)
Available in
days
days
after you enroll
- 下載練習範例並運行 (2:20)
- 課程練習網址
- Grid 額外練習章節：網格系統 (9:53)
- Grid 額外練習章節：媒體物件 (3:54)
- Borders 邊框 (5:59)
- Clearfix 清除浮動（好用） (1:24)
- Close Icon 關閉圖示 (1:02)
- Color 顏色（重要） (2:56)
- Display 顯示屬性（重要） (4:35)
- Embed 內嵌 (1:59)
- 通用類別 Flex（非常重要） (9:21)
- 通用類別 Float（好用） (2:15)
- Image replacement 圖像替換 (0:47)
- Image replacement 圖像替換-課程補充
- Position 位置（好用） (3:23)
- Screenreaders 螢幕閱讀器 (0:57)
- Sizing 尺寸 (1:18)
- Spacing 間隔（非常重要） (3:49)
- Text 文字（非常重要） (3:04)
- vertical-align 垂直對齊 (1:32)
- Visibility 可見性 (0:54)
- Utilities 章節測驗
Bootstrap 元件 (Components)
Available in
days
days
after you enroll
- Bootstrap 文件概述 (4:15)
- 盲人如何閱讀網頁 (網頁親和性與他的工具) (6:47)
- 盲人如何閱讀網頁 (網頁親和性與他的工具)-課程補充
- Sass 與 Bootstrap (4:29)
- Alerts 警報（好用） (4:00)
- Badge 標籤 (3:32)
- breadcrumb 麵包屑 (2:27)
- Buttons 按鈕（非常重要） (11:15)
- Button group 按鈕群組 (5:58)
- Card 卡片（重要） (11:18)
- Carousel 輪播 (3:42)
- Collapse 折疊（重要） (4:51)
- Dropdowns 下拉選單（好用） (4:14)
- Forms 表單（非常重要） (11:48)
- 表單驗證 (4:04)
- Input group / Input 群組 (3:23)
- Jumbotron 廣告大屏幕 (1:12)
- List group 列表群組 (4:58)
- Modal 互動視窗（重要） (4:15)
- Navs 導覽（好用） (4:39)
- Navbar 導覽列（非常重要） (7:18)
- Pagination 分頁 (2:28)
- Popovers, Tooltips / 彈出提示框、工具提示框（好用） (3:40)
- Scrollspy 滾動監控 (2:08)
- Progress 進度條 (3:19)
實作練習： Blog 網站版型
Available in
days
days
after you enroll
形象首頁版型介紹
Available in
days
days
after you enroll
後台版型介紹 上線
Available in
days
days
after you enroll
購物網站介面上線
Available in
days
days
after you enroll
Bootstrap 與 Sass
Available in
days
days
after you enroll
更好的 Bootstrap 版型開發
Available in
days
days
after you enroll
Bootstrap JavaScript 元件補充說明
Available in
days
days
after you enroll
Bootstrap 最終挑戰
Available in
days
days
after you enroll
