• 姓名:李育全
• 學號:4050c050
• 回我的個人首頁

• 第三堂課
• 3.1.B 第一個 CSS 文字、背景的調整
• 3.2.A 考慮單位大小，例如文字大小
• 3.2.B 許多底色的設定方式
• 3.3.A 使用 head 內的 style 修改預設標記顯示模式
• 3.3.B 加上底圖的設定方式
• 3.4.A 表格加上兩種不同的 tr 顯示模式
• 3.4.B 設定類別影響子標記的方式 (table.class1 tr {..})
• 3.5.A 使用 id 取代 class 的方案
• 3.6.A 使用外部檔案來處理 css 的呼叫

• 第四堂課
• 4.1.A 中文作業系統常見的支援字型
• 4.1.B 字距、行距與留白
• 4.1.D 由自己的網站提供免費授權的字型
• 4.2.A 關於行內元件 (inline block) 的超連結設計
• 4.3.A 關於 :hover 的應用
• 4.4.A 關於清單的特殊效果
• 4.4.B 清單的項目符號使用圖示來展示
• 4.5.A 空氣品質表格處理
• 4.5.B 空氣品質表格處理:collapse框線重疊
• 4.6.A 以清單來說明使用ul li會產生的後帶繼承影響問題
• 4.6.B 承上，使用ul>li
• 4.6.B display搭配hover

• 第五堂課
• 5.1.A 關於方塊：內部元素寬度、內部留白、框線、外部留白
• 5.1.B 方塊的水平置中
• 5.1.C 方塊框線形狀變化與陰影 (position)
• 5.1.D 自製框線 (position)
• 5.2.A 方塊的對齊 (vertical-align) 以及浮動 (float) 對齊 (position)
• 5.2.B 讓圖示排版整齊，不會跑掉的方法
• 5.2.C 排版向上對齊的方式
• 5.2.D 使用 float 漂浮對齊以及父元素的問題
• 5.3.A 方塊位置的特性 (position)

• 第六堂課
• 5.1.A 關於方塊：內部元素寬度、內部留白、框線、外部留白
• 5.1.B 方塊的水平置中
• 6.2.A 寧夏的歌詞 (三張底圖的處理方式)
• 6.2.B 底圖的填滿效果 (contain vs. cover)
• 6.2.C 使用底圖產生假按鈕的效果
• 6.3.A 特定效果的圖示變化
• 6.4.A 使用 transform - rotate 來改變圖層的變化
• 6.4.B 使用 transform - translate+scale來改變圖層的變化
• 6.5.A 特定效果的圖示變化-加上漸變(transition)
• 6.6.A 使用動畫 (animation) 特效
• 6.6.B 以動畫方式讓企鵝一直旋轉旋轉
• 6.6.C 讓底圖的蜜蜂飛
• 6.6.D 讓動畫持續輪轉

• 第七堂課
• 7.1.A 一般導覽列使用清單項目搭配 CSS 特效功能 (7±2的按鈕)
• 7.1.B 修改導覽列加入active的樣板
• 7.1.C 修改導覽列，讓按鈕鍵沒有框線
• 7.2.A 讓導覽列擁有第二層選單的功能
• 7.2.B 讓導覽列第二層選單可以有滑動特效
• 7.3.A 讓圖片具有超連結的功能
• 7.4.B 使用Balsamip Markup快速建置網站示意圖
• 7.5.A 以HTML5的新標籤處理整體的風格樣式

• 第八堂課
• 8.2.A 單欄式版面設計
• 8.2.B 雙欄式版面設計

• 第九堂課
• 9.1.A 製作第一個 PHP 網頁

HOME WORKs

• 第三堂功課
  • 3.7.2 :外部的CSS風格設定檔主要內容
  • 3.7.3 :以CSS風格取代HTML的課表展示
  • 3.7.4 :外部的CSS風格取代HTML的特殊符號對應表
  • 3.7.5 :外部的CSS風格取代HTML的書籍清單展示

• 第四堂功課
  • 練習4-7-2：以CSS修飾古文
  • 練習4-7-4：以CSS修飾清單及巢狀清單隱藏使用
  • 練習4-7-5：已CSS修飾表格

• 第五堂功課
  • 練習5-5-2：使用position排版
  • 練習5-5-4：使用:honer搭配visbility隱藏答案

• 第六堂功課
  • 練習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：透過地圖連結以及清單項目的絕對位址說明