姓名：陳鋐鈞

學號：4050C055

回我的個人首頁

上課的資料

• 第三堂課
  • 例題 3.1.B 第一個 CSS 文字、背景的調整
  • 第3堂課 3.2.1：考慮單位大小
  • 第3堂課 3.2.2：設定底色的方式
  • 第3堂課 3.3.1：使用 head 內的 style 修改預設標記顯示模式
  • 第3堂課 3.3.2：加上底圖的設定方式
  • 第3堂課 3.4.1：表格加上兩種不同的 tr 顯示模式
  • 第3堂課 3.4.2：設定類別影響子標記(table.class ,tr{..})
  • 第3堂課 3.5.1：使用 id 取代 class 功能
  • 第3堂課 3.6.1：呼叫外部CSS風格設定檔

• 第四堂課
  • 第4堂課 4.1.1：簡單文字的滾滾長江東逝水
  • 第4堂課 4.1.2：加上內部留白的 padding 處理
  • 第4堂課 4.1.4：使用自己伺服器提供的字型
  • 第4堂課 4.2.1：關於行內元件 (inline block) 的超連結設計
  • 第4堂課 4.2.2：讓 a 變成區塊元素
  • 第4堂課 4.3.1：hover應用
  • 第4堂課 4.4.1：關於清單的特殊效果
  • 第4堂課 4.4.2：清單的項目符號使用圖示來展示
  • 第4堂課 4.5.1：空氣品質表格處理
  • 第4堂課 4.5.2：框線強調
  • 第4堂課 4.6.1：繼承
  • 第4堂課 4.6.2：繼承2
  • 第4堂課 4.6.3：繼承3

• 第五堂課
  • 第5堂課 5.1.1： 關於方塊：內部元素寬度、內部留白、框線、外部留白
  • 第5堂課 5.1.2： 方塊模型的置中處理(水平對齊, margin)
  • 第5堂課 5.1.3： 方塊模型的圓角與陰影
  • 第5堂課 5.1.4： 方塊模型使用圖檔作為框線的來源
  • 第5堂課 5.2.1： 方塊的對齊 (vertical-align) 以及浮動 (float) 對齊
  • 第5堂課 5.2.2： 讓圖示排版整齊，不會跑掉的方法
  • 第5堂課 5.2.3： 排版向上對齊的方式
  • 第5堂課 5.2.4： 使用 float 漂浮對齊以及父元素的問題
  • 第5堂課 5.3.1： 5.3.A 位置探討 - 正常流向時，使用 margin 調整移動的位置
  • 第5堂課 5.3.2： 位置探討 - 承上，使用 z-index 搭配 position 來調整圖層
  • 第5堂課 5.3.3： 位置探討 - 一般排版，使用垂直朝上對齊的效果，分三欄位
  • 第5堂課 5.3.4： 位置探討 - 使用 position relative 來調整單一方塊移動的效果
  • 第5堂課 5.3.5： 位置探討 - 使用 position fixed 來增加一個類似按鈕方塊的功能
  • 第5堂課 5.4.1 : 討論不同的 overflow 效果展示
  • 第5堂課 5.4.2 : 圓形的大頭貼產生的方式
  • 第5堂課 5.4.3 : 討論 visibility 搭配 hover 的效果

• 第六堂課
  • 第6堂課 6.1.1： 色彩漸層的初體驗
  • 第6堂課 6.1.2： 圓形的彩虹漸層處理
  • 第6堂課 6.2.1： 三張底圖的處理方式
  • 第6堂課 6.2.2： 底圖的填滿效果 (contain vs. cover)
  • 第6堂課 6.2.3： 用底圖產生假按鈕的效果
  • 第6堂課 6.3.1： 特定效果的圖示變化
  • 第6堂課 6.4.1： 使用 transform - rotate 來改變圖層的變化
  • 第6堂課 6.4.2： 使用 transform - translate+scale來改變圖層的變化
  • 第6堂課 6.5.1： 特定效果的圖示變化-加上漸變(transition)
  • 第6堂課 6.6.1： 讓圖示自己動的小動畫-1(@keyframes)
  • 第6堂課 6.6.2： 讓企鵝轉圈圈
  • 第6堂課 6.6.3： 在背景下的蜜蜂會飛來飛去的
  • 第6堂課 6.6.4： 經常用在首頁旋轉圖示的小動畫效果

• 第七堂課
  • 例題 7.1.A 第一個導覽列功能
  • 例題 7.1.B 第一個導覽列功能-外加活動中的項目
  • 例題 7.1.C 第一個導覽列功能-按鈕連在一起
  • 例題 7.2.A 第一個下拉式選單
  • 例題 7.2.B 做選單的 transition 漸變特效
  • 例題 7.3.A 使用圖片地圖的超連結導覽方式
  • 例題 7.4.B 使用 Balsamiq 超快速製作頁面簡介
  • 例題 7.5.A 一層一層建置好所需要的版型(搭配 7.4.B)

• 第八堂課
  • 例題 8.1.A 網站的位置標記：導覽列、子導覽列、麵包屑導覽列
  • 例題 8.2.A 單欄、兩欄、三欄網頁的實際設計
  • 例題 8.2.B 雙欄式版面設計
  • 例題 8.4.A 網站初步設計：網站地圖、版面配置 (以兩欄式為主)

• 第九堂課
  • 例題 9.1.B
  • 例題 9.1.C
  • 例題 9.1.D
  • 例題 9.1.E
  • 例題 9.3.A
  • 例題 9.4.A

Home Works

第三堂課

• 習題 3.7.2：外部CSS風格設定
• 習題 3.7.3：課表的製作
• 習題 3.7.4：特殊符號對應表
• 習題 3.7.5：書籍清單

第四堂課

• 習題 4.7.2：李白(+反白)
• 習題 4.7.4：以CSS修飾清單以及巢狀清單的隱藏使用
• 習題 4.7.5-以CSS修飾表格以及:hover的美化

第五堂課

• 習題 5.5.2：使用position進行排版
• 習題 5.5.3：使用:hover搭配visibility進行答案隱藏

第六堂課

• 習題 6.7.2：
• 習題 6.7.3：
• 習題 6.7.4：
• 習題 6.7.5：
• 習題 6.7.6：
• 習題 6.7.7：

第七課

• 習題 7.6.2
• 習題 7.6.3
• 習題 7.6.4
• 習題 7.6.5