姓名: 泰瑞
學號: 4070C039
回首頁
第三堂課
第一次使用 CSS
CSS 單位的理解
CSS 顏色的使用
在 head 使用 style
CSS 背景圖
Class 類別的使用
使用類別與背景
使用 id 來設定 CSS 囉
使用外部呼叫的 CSS
第四堂課
CSS 字體字型應用
加上 padding
使用 Google 免費字行
超連結的: hover 特效
把 a 變成區塊元素
任何東西都用: hover 效果
CSS 的清單特效
CSS 的清單特效-圖形效果
CSS 的表格效果
CSS 的表格效果-摺疊(collapse)效果
CSS 父與子的繼承問題
CSS 父與子的繼承問題-使用>
CSS 的隱藏效果
第五堂課
CSS 的 div 方塊應用
CSS 的 div 方塊-置中
CSS 的 div 方塊-圓角與陰影
div 的框限應用-圖檔當框線
div 的 inline-block 展示
div 的簡易排版方式
div 的垂直排版方式 (vertical-align)
div 的簡易排版 - float 的使用
div 的簡易排版 - float 搭配 overflow
版面調配 - 預設的 margin 處理即可
版面調配 - relative 搭配 z-index 調整圖層
版面調配 - 標準調配方塊
版面調配 - 版面調配 - relative 的單一方塊移動
版面調配 - 版面調配 - absolute 同一個參考原點
版面調配 - 版面調配 - fixed 固定在瀏覽器的某個地方
版面調配 - 版面調配 - 用 overflow 控制過多的資料
使用 hidden 設計圓形大頭貼
使用隱藏來處理算命的答案
第六堂課
使用漸層背景色
使用漸層背景色-大頭彩虹圖
背景圖的應用-三張背景圖同時存在
背景圖的應用-填滿背景的 contain, cover 用法
背景圖的應用-假裝的按鈕設計
圖片的放大應用
圖片的旋轉應用 - transform: rotate 功能
圖片的位移與尺寸變化 - transform: translate, scale 功能
圖片的漸變特效 - transition 功能
圖片的漸變特效 - 使用動畫讓它自己動
圖片的漸變特效 - 讓蜜蜂自己飛來飛去
圖片的漸變特效 - 讓超連結框循環轉來轉去
圖片的漸變特效 - 單純給你看不給你點擊的旋轉圖
第七堂課
清單做成導覽列的練習
清單做成導覽列的練習-增加一個識別項目(.active)
清單做成導覽列的練習-讓按鈕綁在一起
具有下拉式的第二層選單效果
使用圖片當成按鈕的樣式
用 balsamiq 做快速版面配置示意圖
完整的版面配置實際製作
第八堂課
單欄式版面設計
兩欄式版面設計
第九堂課
第一個 PHP 網頁測試
練習 PHP 的變數
最陽春的迴圈練
色票製作-單迴圈
色票製作-雙迴圈
色票製作-三迴圈
色票製作-對比色處理
用 date 函數抓伺服器的時間
用 if 搭配 date 回應時間應答
呼叫外部檔案來實驗
從網址列輸入變數內容
從網址列輸入變數內容-增加XSS防禦
剪刀頭布
跟電腦猜拳
隨機產生人物屬性的方式
許多照片隨便丟在某個空間內
Home Work
作業三
外部的 CSS 風格設定擋主要內容
以 CSS 風格取代 HTML 的課表示
以 CSS 風格取代 HTML 的特殊符號對應表
以 CSS 風格取代 HTML 的書籍清單展示
作業四
以 CSS 修飾古文的展示
以 CSS 修飾清單以及巢狀清單的隱藏使用
以 CSS 修飾表格以 :hover 的美化
作業五
使用 position 進階排版
使用 :hover 搭配 visibility 進行答案隱藏
作業六
使用漸層處理與圖片重疊技巧，處理彩虹人物象
直立的按鈕改橫式按鈕，並增加一個案紐
圖示放大變成在正中央放大，不是像右下放大的模樣
承上，加上漸變的功能
蜜蜂飛來飛去，衝向螢幕來嚇你
照片幻燈片淡出/淡入效果功能
作業七
使用較清爽的導覽列模式
讓原本橫的導覽列變成直的導覽列模式
預計達成的期中報告網站列表
透過地圖連結以及清單項目的絕對位址說明
作業九
九九乘法列表
剪刀石頭布
透過陣列設計及亂數，取得最大獎的抽獎活動