對於不知道怎麼設計出網頁版型或是不同功能的你，趕緊跟著老師一起利用 Bootstrap 來快速設計網頁吧！
鼻涕男孩
講師介紹
設計
程式
網頁設計
網頁設計
Bootstrap 4 網頁設計與應用
這堂課我會學到
-
Bootstrap 4 套用的技巧與設計
-
透過簡單易懂的實例練習，快速學會 Bootstrap 的應用
課前資訊
學員上課前需具備哪些軟、硬體設備或常識
對網頁有興趣，並具備 HTML 及 CSS 基礎概念
一台可連上網路的電腦，並已安裝 Sublime Text 文字編輯器
課程適合對象
學習網頁設計相關科系的學生
對於前端網頁設計工作有興趣的人
想快速利用框架設計網頁的人
課程大綱
20節
02:52:32
-
課程介紹
-
課程介紹短片
-
-
1. 認識 Bootstrap1節09:31
-
1.1 Bootstrap 介紹09:31
-
-
2. 「布局」導讀2節11:30
-
2.1 版型與分斷點概述05:41
-
2.2 媒體對象的使用05:49
-
-
3. 「內容」導讀5節42:27
-
3.1 初始化與排版10:39
-
3.2 圖片與圖文框05:21
-
3.3 表格應用11:10
-
3.4 「公共樣式」導讀09:35
-
3.5 Icon 圖標使用05:42
-
-
4. 格線系統與組件12節01:49:04
-
4.1 認識格線系統21:47
-
4.2 警告提示框與標籤及麵包屑05:22
-
4.3 按鈕群組與下拉選單08:21
-
4.4 卡片組件與列表群組13:18
-
4.5 橫幅大圖輪播11:28
-
4.6 輪播的按鈕樣式修改04:30
-
4.7 摺疊面板與大屏幕08:29
-
4.8 表單與輸入框08:48
-
4.9 彈出對話框與動態提示效果08:20
-
4.10 導航選單09:07
-
4.11 其他05:46
-
4.12 線上格線產生器03:48
-
課程介紹
你是否遇到以下難題？
想不出要設計哪種網頁版型，好苦惱？
從頭開始寫程式碼來美化網站，光想頭就痛？
客戶、老闆快逼瘋，哪有省時省力的網頁樣板可套用？
從頭開始寫程式碼來美化網站，光想頭就痛？
客戶、老闆快逼瘋，哪有省時省力的網頁樣板可套用？
你為何要用 Bootstrap
Bootstrap 是目前最受歡迎，也是最多人選用的 CSS 前端框架，但「框架」又能拿來做什麼呢？
所謂框架就是「可直接套用功能」的範本（或稱為模板、模組），不論是一般的常見的長形網頁，或是可符合不同尺寸的 RWD 網頁，Bootstrap 已經都替你設計好樣式與功能，只要選擇你想要的效果，即可快速幫你設計好所需的版型，或是建立常見的功能，像是常用的導覽選單、大圖輪播、圖文編排...等等。
加快網頁設計速度與品質
當你學會了 RWD 網站設計的基礎 - HTML 及 CSS 之後，在這個分秒必爭的社會裡，能夠快速並有效率的完成網站設計，並讓設計品質更能符合老闆或是客戶的期待，才能幫助你順利邁向加薪之路，或是有源源不絕接不完的 case。
課程特色
- 用最快速易懂的方式，快速套用不同的設計效果到空白的網頁中
- 了解常用的 Bootstrap 效果與設計技巧
對於不知道怎麼設計出網頁版型或是不同功能的你，趕緊跟著老師一起利用 Bootstrap 來快速設計網頁吧！
課程討論與問答
-
要先登入才能做留言
