• 上課連結
• 學號:4050c030
• 回首頁

上課連結

第三堂課

• 3-1-2:使用css的style取代font,strong 等標記
• 3-2-1:使用css的「數值的單位」修改某些特性的大小大小
• 3-2-2:搭配Body的css整體網頁風格的效果
• 3-3-1:直接在head內增加style設定css風格
• 3-3-2:在表格上面套用底圖的設計方式
• 3-4-1:使用css套用表格兩個不同橫列的設計
• 3-4-2:統一表格的單一class設計方式
• 3-5-1:使用id取代class的功能
• 3-6-1:呼叫外部css風格設定檔

Homeworks

第三堂課程課後練習

• 3-7-2:外部的CSS風格設定檔主要內容
• 3-7-3:以CSS風格取代HTML的課表展示
• 3-7-4:以CSS風格取代HTML的特殊符號對應表
• 3-7-5:以CSS風格取代HTML的書籍清單展示

第四堂課

• 4-1-1:滾滾長江東逝水
• 4-1-2:承上，加上padding 處理
• 4-1-4:承上， 但是使用自己伺服器提供的字型
• 4-2-1:超連結的特殊效果 (:hover)
• 4-2-2:超連結元素變成區塊元素 (display: block)
• 4-3-1:任何東西都可以 :hover 的啦
• 4-4-1:清單的中文數字顯示
• 4-4-2:清單的項目符號使用圖示來展示
• 4-5-1:空氣品質表格處理
• 4-6-1:繼承的一些事
• 4-6-2:承上，使用ul>li討論後代
• 4-6-3:使用display搭配 討論隱藏資料的特效

第四堂課程課後練習

• 4-7-2:以css修飾古文展示
• 4-7-4:以css修飾清單以及巢狀清單的隱藏顯示
• 4-7-5:以css修飾表格以及:hover的美化

第五堂課

• 5-1-1:使用方塊的留白與相關框線
• 5-1-2:區塊標記的左右對齊
• 5-1-3:方塊加上圓角以及陰影的方式
• 5-1-4:使用自製框線
• 5-2-1:利用display讓區塊標記
• 5-2-2:在小方塊外面加上一個大方塊
• 5-2-3:利用vertical align
• 5-2-4:內部靠上對齊fioat
• 5-2-5:外部框線補齊用overflow
• 5-3-1:使用margin調整移動的位置
• 5-3-2:使用z-index搭配position來調整圖層
• 5-3-3:使用垂直朝上對齊的效果，分三欄位
• 5-3-4:來調整單一方塊移動的效果
• 5-3-5:來調整全部方塊移動的效果
• 5-3-6:使用posutuon fixed 來增加一個類似按鈕方塊的功能
• 5-4-1:討論不同的overflow效果展示
• 5-4-2:圓形大頭貼產生的方式
• 5-4-3:討論visibility搭配hover的效果

第六堂課

• 6-1-1:色彩漸層的背景
• 6-1-2:圓形外框大頭貼照加上厚重彩虹圓形
• 6-2-1:多張底圖的處理方式
• 6-2-2:背景放大到邊框的型態
• 6-2-3:影像透明度的使用的處理
• 6-3-1:方塊內圖片上面疊上文字說明的統一格式處理
• 6-4-1:多重圖示的轉動技巧加上萬用字元的呼叫使用
• 6-4-2:圖示的重疊畫面展示
• 6-5-1:以漸變方式直接取代變化的功能
• 6-6-1:以動畫方式讓滑鼠特效變成一直變動的畫面
• 6-6-2:以動畫方式讓企鵝一直轉圈圈
• 6-6-3:讓底圖的蜜蜂飛
• 6-6-4:讓動畫持續輪轉

第六堂課程課後練習

• 6-7-2
• 6-7-3
• 6-7-4
• 6-7-5
• 6-7-6
• 6-7-7

第七堂課

• 7-1-1
• 7-1-2
• 7-1-3
• 7-2-1
• 7-2-2
• 7-3-1
• 7-4-1
• 7-4-2
• 7-5-1

第七堂課程課後練習

• 7-6-2
• 7-6-3
• 7-6-4
• 7-6-5

第八堂課

• 8-2-1
• 8-2-2

第九堂課