| 講義節次 | 範例參考 | 說明 | 練習檔案 |
|---|---|---|---|
| 1-3,
1-4 1-5, 1-6 |
認識 HTML、認識 CSS | css001 | |
| 1-8 | 範例參考 | 認識 block、inline、inline-block | css002 |
| 1-9 | 範例參考 | 練習最基本的網頁排版 (排版思維流程第一～三階段) | css003 |
| 1-12-16 | 探討 margin 的三心二意 | css004 | |
| 1-9, 1-12-1 | 範例參考 | 練習 Flex 彈性框架設計水平靠右垂直貼下導覽按鈕 (排版思維流程第四階段) | css005 |
| 1-9, 1-12-1 | 範例參考 | 練習 Flex 彈性框架設計水平垂直皆置中的導覽按鈕 (排版思維流程第四階段) | css006 |
| 1-9, 1-12-1 | 範例參考 | 練習 Flex 彈性框架設計水平中央垂直貼下導覽按鈕 (排版思維流程第四階段) | css007 |
| 1-10 | 範例參考 | 練習 CSS 設計的優先權問題 | css008 |
| 1-12 | 範例參考 | 配合排版 + 練習 CSS3 動態效果設計 | css009 |
| 1-9, 1-7 | 範例參考 | 滑鼠滑入出現提示說明 (下方深藍色區塊) | css010 |
| 講義節次 | 範例參考 | 說明 | 練習檔案 |
|---|---|---|---|
| 2-1 ~ 2-4 | 認識JavaScript「程式的 3 個基本能力」+「物件的 3 個基本控制」+「function自定函式」 | js001 | |
| 2-4 | 範例參考 | 練習 JavaScript 控制顯示現在時間 | js002 |
| 2-8 | 認識 jQuery 改良上述範例 | js003 | |
| 2-11 | 範例參考 | 練習 jQuery 【內容】的取得與改變 | js004 |
| 2-12 | 範例參考 | 練習 jQuery 【樣式】的取得與改變 | js005 |
| 2-13 | 範例參考 | 練習 jQuery 【規律基礎動畫】的控制 | js006 |
| 2-13 | 範例參考 | 練習 jQuery 【下拉式選單】的設計 | js007 |
| 2-13 | 範例參考 | 練習 jQuery 【折疊式面板】的設計 | js008 |
| 2-13, 2-14 | 範例參考 | 練習 jQuery 【自定動畫】的控制 | js009 |
| 2-15, 2-14 | 範例參考 | 練習 jQuery 全頁的滑動 | js010 |