姓名 袁曉樂
學號 C110A006
Back
上課連結
第三課
3.1.B: 學習 CSS 字型/底色
3.2.A: 學習 CSS 字體大小/底色
3.3.A: 學習 CSS head 內的 style
3.3.B: 學習 CSS 的底色與底圖設計
3.4.A: 學習 CSS table 與 class 應用
3.5.A: 學習 CSS table 與 id 應用
3.6.A: 學習 CSS 使用外部呼叫檔案
第四課
4.1.A: 用 CSS 展示古詩詞
4.1.B: 用 CSS 展示古詩詞-使用 padding 留白
4.2.A: 用 CSS 改變a超連結樣式
4.2.B: 用 CSS 改變 a 超連結樣式-a變區塊 (display: block)
4.3.A: 使用 :hover 改變滑鼠效果
4.4.A: 用 CSS 修改清單效果-中文數字
4.4.B: 用 CSS 修改清單效果-圖示結果
4.6.A: 簡單巢狀清單
4.6.C: 簡單巢狀清單 - 隱藏子清單的效果
第五課
5.1.A: 第一個方塊樣式的練習
5.1.B: 第一個方塊樣式的練習-方塊水平置中
5.1.C: 第一個方塊樣式的練習-框線圓弧+陰影效果
5.1.D: 第一個方塊樣式的練習-使用自製框線取代原有框線
5.2.A: 方塊位置的變化學習
5.2.B: 方塊位置的變化學習-圖片填滿效果+不太跑版+針對桌機
5.2.C: 方塊位置的變化學習-方塊垂直對齊
5.2.D: 方塊位置的變化學習-浮動在父元素上(float)
5.3.A: 位置(position)的功能-margin的使用
5.3.B: 位置(position)的功能-z-index的使用(圖層)
5.3.C: 位置(position)的功能-inline-block對齊
5.3.D: 位置(position)的功能-增加top/right/bottom/left
5.3.E: 位置(position)的功能-absolute絕對位置的使用
5.3.F: 位置(position)的功能-fixed固定在瀏覽器上面的位置
5.4.A: 父子元素的位置編排-overflow的不同效果
5.4.B: 父子元素的位置編排-圓形大頭貼
5.4.C: 父子元素的位置編排-分析display與visiblity的差異
第六課
6.1.A: 練習漸層-使用底色漸層
6.1.B: 練習漸層-大頭貼外面加漸層顏色
6.2.A: 背景處理-三個背景功能
6.2.B: 背景處理-背景的填滿功能 (contain, cover)
6.2.C: 背景處理-大量重複的背景假按鈕 (opacity)
6.3.A: 圖片的 hover 放大/縮小功能
6.4.A: 圖片變化的效果-旋轉
6.4.B: 圖片變化的效果-五張圖疊疊樂
6.5.A: 圖片的 hover 放大/縮小功能-transition 搭配
6.6.A: 圖片的 hover 放大/縮小功能-自行動畫效果
6.6.C: 動畫效果-改底圖-讓蜜蜂飛
6.6.D: 圖片變化的效果-五張圖疊疊樂-動畫滑動
第七課
7.1.A: 簡單單層導覽列
7.1.B: 簡單單層導覽列-增加 active 按鈕
7.1.C: 簡單單層導覽列-增加 active 按鈕-按鈕列沒空白
7.2.A: 雙層導覽列效果
7.2.B: 雙層導覽列效果-慢慢下拉
7.3.A: 圖片使用地圖 usemap 功能
7.5.A: HTML5完整版面設計-一個範例
第八課
8.1.A: 單欄設計
8.2.A: 雙欄設計
Homework
第三課練習
ex03-7-3作業
ex03-7-4作業
ex03-7-5作業
第四課練習
ex.04-7-2作業
ex.04-7-4作業
ex.04-7-5作業
第五課練習
ex.05-5-2作業
ex.05-5-3作業
第六課練習
ex.06-7-2作業
ex.06-7-3作業
ex.06-7-4作業
ex.06-7-5作業
ex.06-7-6作業
ex.06-7-7作業
第七課練習
ex07-6-2功課
ex07-6-3功課
ex07-6-4功課
ex07-6-5功課