• 姓名：嚴紹倫
• 學號：4060C013
• 回我的個人首頁

第三堂課內容

• 例題 3.1.B: 第一次使用 CSS 取代 <font>
• 例題 3.2.A: 探討CSS的單位
• 例題 3.2.B: 探討CSS的簡易使用
• 例題 3.3.A: CSS在head使用的整體設定值
• 例題 3.3.B: CSS處理背景
• 例題 3.4.A: CSS處理兩種不同的CLASS
• 例題 3.4.B: 使用CSS處理底圖
• 例題 3.5.A: 使用ID呼叫而不是使用CLASS
• 例題 3.6.A: 從外部呼叫的style.css樣式
• 例題 4.1.A: 簡易的 CSS 字型處理
• 例題 4.1.B: 簡易的 CSS 字型處理padding內部留白
• 例題 4.1.D: 使用本伺服器提供的中文字形
• 例題 4.2.A: 超連結使用
• 例題 4.2.B: 超連結變成區塊
• 例題 4.3.A: 任何地方都能用hover
• 例題 4.4.A: 清單的效果
• 例題 4.4.B: 清單的效果項目便圖片
• 例題 4.5.A: 表格功能的CSS修訂
• 例題 4.5.B: 表格功能-border-collapse功能
• 例題 4.6.A: 繼承-清單為例
• 例題 4.6.B: 後代子孫不被影響
• 例題 4.6.C: display的隱藏效果
• 例題 5.1.A: 方塊初探
• 例題 5.1.B: 方塊 - 水平置中
• 例題 5.1.C: 方塊 - 框線的圓角+陰影
• 例題 5.1.D: 方塊 - 自製的邊框圖片 (90x90 為例)
• 例題 5.2.A: 方塊 - 將方塊變成行內元素
• 例題 5.2.B: 方塊 - 盡量不要跑版的設計之一
• 例題 5.2.C: 方塊 - 用 vertical-align 進行向上對齊的功能(放在子元素內喔!)
• 例題 5.2.D: 方塊 - 用 float 進行向上對齊的功能
• 例題 5.2.E: 方塊 - 加上 overflow 的父元素功能
• 例題 5.3.A: 方塊 - 兩個方塊的重疊與透明度
• 例題 5.3.B: 方塊 - 透過 z-index 調整元素的圖層上/下
• 例題 5.3.C: 方塊 - position 位置初探
• 例題 5.3.D: 方塊 - position - relative 的移動
• 例題 5.3.E: 方塊 - position - absolute 的移動
• 例題 5.3.F: 方塊 - position - fixed 固定的位置上
• 例題 5.4.A: 方塊 - overflow 的探討
• 例題 5.4.B: 方塊 - 圓形大頭貼
• 例題 5.4.C: 方塊 - visibility 的隱藏效果
• 例題 6.1.A: 背景的漸層效果初探
• 例題 6.1.B: 背景的漸層效果--用於大頭照
• 例題 6.2.A: 背景--多張背景的應用
• 例題 6.2.B: 背景--背景填滿的效果-cover, contain
• 例題 6.2.C: 背景--清單變成按鈕的效果
• 例題 6.3.A: 照片圖文框的設計
• 例題 6.5.A: 照片圖文框的設計-增加漸變功能 (類似動畫)
• 例題 6.4.A: 方塊的變形--角度變化與疊圖
• 例題 6.4.B: 方塊的變形--方塊的大小、位置
• 例題 6.6.A: 讓圖片自己動的小小動畫效果
• 例題 7.1.A: 用清單設計導覽列
• 例題 7.1.B: 用清單設計導覽列:增加瀏覽中的頁面
• 例題 7.1.C: 用清單設計導覽列:增加瀏覽中的頁面-連在一起
• 例題 7.2.A: 用清單設計導覽列-兩層導覽頁
• 例題 7.2.B: 用清單設計導覽列-兩層導覽頁-加上下拉效果
• 例題 7.3.A: 用圖片進行超連結map功能
• 例題 7.4.B: 使用 Balsamiq 設計簡單的網頁草圖
• 例題 7.5.A: 主要版面配置建置
• 例題 8.2.A: 版面配置-單欄式設計
• 例題 8.2.B: 版面配置-兩欄式設計
• 例題 9.1.A: 第一個php程式
• 例題 9.1.B: 使用變數處理
• 例題 9.1.C: 迴圈搭配表格做出網頁安全色
• 例題 9.1.D: 迴圈搭配表格做出網頁安全色-對比色
• 例題 9.1.E: 目前伺服器的時間
• 例題 9.1.F: 用date()判斷時間,並告知問候語
• 例題 9.2.B: 透過function處理時間問候語
• 例題 9.3.A: 使用網址傳遞變數給伺服器處理
• 例題 9.3.B: 解決xss
• 例題 9.4.A: 電腦隨機出全
• 例題 9.4.B: 跟電腦猜拳
• 例題 9.4.C: 隨機計算人類屬性
• 例題 9.4.D: 照片隨便丟

homeworks

• 第三堂作業
• 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修飾表格以及: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: 透過地圖連結以及清單項目的絕對位址說明
• 第九堂課作業
• 習題:09.5.2 九九乘法表列表
• 習題:09.5.3 剪刀石頭布
• 習題:09.5.4 透過陣列以及亂數，取得最大獎的抽獎活動