學習 CSS

• 姓名: 陳冠銘
• 學號: 4120C018
• 回到上一層我的首頁

CSS 相關課程

• unit03
  • 3.3.1 使用全域處理 CSS - 網路線介紹
  • 3.3.2 開始使用背景圖示-background
  • 3.4.1 開始使用 class - 以表格展示
  • 3.6.1 開始使用外部檔案呼叫 CSS 類別
• unit04
  • 4.1.1 字型練習 - 預設的連覽器字型
  • 4.2.1 練習不同字型 - 呼叫 google fonts 的方法
  • 4.1.3 處理超連結效果 :hover 初探
  • 4.2.2 處理超連結效果 - 把a變成區塊元素
  • 4.3.1 測試 :hover 在任意的地方
  • 4.4.1 用css修改ul,ol,li...
  • 4.6.1 了解一下繼承
• unit05
  • 5.1.1 初探方塊 - 了解邊界
  • 5.1.3 初探方塊 - 框限圓角和陰影
  • 5.1.4 初探方塊 - 自製框線
  • 5.2.1 兩個方塊的對齊 - 預設值
  • 5.2.2 兩個方塊的對齊 - 使用大外框限制寬度
  • 5.2.3 兩個方塊的對齊 - 用 virtical-align 設計垂直對齊
  • 5.2.4 兩個方塊的對齊 - 用 float 漂浮在父元素上面
  • 5.3.1 多個方塊的位置設計 - 先用 margin 處理
  • 5.3.3 多個方塊的位置設計 - 先用 vertical-align top 對齊
  • 5.3.5 多個方塊的位置設計 - 用 position:absolute 處理
  • 5.3.6 方塊固定位置的方法 - 用 position:fixed 處理
  • 5.4.1 使用 overflow 限制子元素的內容
  • 5.4.2 圓形照片 - 使用 overflow
  • 5.4.3 使用 display 隱藏/顯示答案
• unit06
  • 6.1.1 使用漸層背景
  • 6.1.2 使用漸層背景-大頭照加上彩虹
  • 6.2.1 三張底圖的應用
  • 6.2.2 底圖填滿的效果 (contain/cover)
  • 6.2.3 用底圖搭配清單設計按鈕
  • 6.3.1 用 CSS 做會動的圖示
  • 6.5.1 用 CSS 做會動的圖示-搭配transition
  • 6.4.1 圖示方塊的旋轉 - transform: rotate
  • 6.4.2 圖示方塊的變化 - transform: translate/scale
  • 6.6.1 用 CSS 做會動的圖示-動畫效果
  • 6.6.4 用 CSS 做會動的圖示-方塊的移動
• unit07
  • 7.1.1 使用漸層背景
  • 7.1.2 單層導覽列-增加 active 功能
  • 7.2.1 雙層導覽列-下拉式選單
  • 7.3.1 地圖超連結的按鈕
  • 7.5.1 HTML5 新標籤應用

Home Works

• 第三章作業
• 外部的CSS風格設定檔主要內容
• ex03.7.3作業
• ex03.7.4作業
• ex03.7.5作業

• 第四章作業
• ex04.7.2作業
• ex04.7.4作業
• ex03.7.4作業

• 第五章作業
• ex05.5.2作業
• ex05.5.3作業

• 第六章作業
• ex06.7.2作業
• ex06.7.3作業
• ex06.7.4作業
• ex06.7.5作業
• ex06.7.6作業
• ex06.7.7作業