• 姓名：You Ru
• 學號：4061c002
• 回我的個人首頁

上課連結

• 第9堂課：第一個 PHP 的網頁
• 第9堂課：利用變數處理
• 第9堂課：迴圈處理網頁安全色
• 第9堂課：迴圈處理網頁安全色-套用文字對比色
• 第9堂課：PHP的伺服器時間顯示
• 第9堂課：PHP的伺服器時間顯示-加上問候語

• 第8堂課：單欄式設計
• 第8堂課：雙欄式設計

• 第7堂課：第一個導覽列功能
• 第7堂課：第一個導覽列功能-外加活動中的項目
• 第7堂課：第一個導覽列功能-按鈕連在一起
• 第7堂課：第一個下拉式選單
• 第7堂課：做選單的 transition 漸變特效
• 第7堂課：使用圖片地圖的超連結導覽方式
• 第7堂課：使用 Balsamiq 超快速製作頁面簡介
• 第7堂課：一層一層建置好所需要的版型

• 第6堂課：色彩漸層的初體驗
• 第6堂課：圓形的彩虹漸層處理
• 第6堂課：寧夏的歌詞 (三張底圖的處理方式)
• 第6堂課：底圖的填滿效果 (contain vs. cover)
• 第6堂課：使用底圖產生假按鈕的效果
• 第6堂課：特定效果的圖示變化
• 第6堂課：使用 transform - rotate 來改變圖層的變化
• 第6堂課：使用 transform - translate+scale來改變圖層的變化
• *第6堂課：qqq
• 第6堂課：以動畫方式讓滑鼠特效變成一值變動的畫面
• 第6堂課：轉企鵝
• 第6堂課：讓蜜蜂飛
• 第6堂課：經常用在首頁旋轉圖示的小動畫效果

• 第5堂課：方塊模型的初級理解
• 第5堂課：方塊模型的置中處理(水平對齊, margin)
• 第5堂課：方塊模型的圓角與陰影
• 第5堂課：方塊模型使用圖檔作為框線的來源
• 第5堂課：方塊對齊的機制-inline-block
• 第5堂課：方塊對齊的機制-外部方塊整合排版
• 第5堂課：方塊對齊的機制-內部靠上對齊用 vertical-align
• 第5堂課：方塊對齊的機制-內部靠上對齊用 float
• 第5堂課：方塊對齊的機制-外部框線補齊用 overflow
• 第5堂課：位置探討 - 正常流向時，使用 margin 調整移動的位置
• 第5堂課：位置探討 - 承上，使用 z-index 搭配 position 來調整圖層
• 第5堂課：位置探討 - 一般排版，使用垂直朝上對齊的效果，分三欄位
• 第5堂課：位置探討 - 使用 position relative 來調整單一方塊移動的效果
• 第5堂課：位置探討 - 使用 position absolute 來調整全部方塊移動的效果
• 第5堂課：位置探討 - 使用 position fixed 來增加一個類似按鈕方塊的功能
• 第5堂課：討論不同的 overflow 效果展示
• 第5堂課：圓形的大頭貼產生的方式
• 第5堂課：討論 visibility 搭配 hover 的效果

• 第4堂課：簡單文字的滾滾長江東逝水
• 第4堂課：承上，加上內部留白的 padding 處理
• 第4堂課：承上，但是使用自己伺服器提供的字型
• 第4堂課：超連結的特殊效果 (:hover)
• 第4堂課：超連結元素變成區塊元素 (display: block)
• 第4堂課：任何東西都可以:hover
• 第4堂課：清單的中文數字顯示
• 第4堂課：清單的項目符號使用圖示來展示
• 第4堂課：空氣品質表格處理
• 第4堂課：空氣品質處理表格處理-針對框線

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

Home Wroks

• 習題7.6.2：清爽版導覽列
• 習題7.6.3：直式選單
• 習題7.6.4：網站
• 習題7.6.5：地圖

• 習題6.7.2：彩虹人物像
• 習題6.7.3：直立的按鈕改橫式按鈕，並增加一個按鈕
• 習題6.7.4：圖示放大變成正中央放大，不是向右下方放大模樣
• 習題6.7.5：承上，加上漸變的功能
• 習題6.7.6：蝴蝶飛
• *習題6.7.7：qqq

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

• 習題4.7.2：以 CSS 修飾古文的展示
• 習題4.7.4：以CSS修飾清單以及巢狀清單的隱藏使用
• 習題4.7.5：以 CSS 修飾表格以及 :hover 的美化

• 習題3.7.2：CSS設定
• 習題3.7.3：以CSS風格取代HTML的課表展示
• 習題3.7.4：以CSS風格取代HTML的特殊符號對應表
• 習題3.7.5：以CSS風格取代HTML的書籍清單展示