CSS 網頁設計語法教學
CSS 網頁設計排版與切版教學課程
札札實實的 CSS 排版基礎教學，鍛練您 CSS 網頁切版基礎功力，各種網頁排版切版範例教學，編排 HTML 結構最乾淨 CSS 最佳化的網頁。
CSS 是網頁排版與網頁切版主要法方，課程還有 CSS SEO 網頁優化搜尋排名優化的教學，課程範例練熟後就可應用到您的工作上喔！
CSS 網頁設計排版與切版教學課程 【週日班】
- 課程教學日期：2021 年 5 月 16 日 ~ 6 月 6 日
- 課程教學日期：5/16、5/23、5/30、6/6
- 課程教學時間：星期日 / 早上 10:00 ~ 1:00 、 下午 2:00 ~ 5:00
CSS 網頁設計排版與切版教學課程 【週六班】
- 課程教學日期：2021 年 6 月 19 日 ~ 7 月 10 日
- 課程教學日期：6/19、6/26、7/3、7/10
- 課程教學時間：星期六 / 早上 10:00 ~ 1:00 、 下午 2:00 ~ 5:00
CSS 網頁設計切版教學 - 課程資訊
- 【 新生報名特價 7800 / 舊生會員特價 7200 】限時特價：付現金再折 200 元
- 付款方式：開課當天現場繳費【 現金 / 刷卡 / 匯款 / 支票 】
- 教學時數：每堂課 3 小時 / 共 8 堂課 / 共 4 週
- 教學教材：CSS教學講義 / CSS切版範例原始檔
- 上課地點：飛肯台北教室 【教室照片】【Google地圖】
- 聯絡電話：(02) 2370-1122
- 課後服務：上完本課程之後, 三年內都可以多次免費申請重修本課程喔！
CSS 網頁設計切版教學 - 課程適合對象
- 1. 對於 CSS 網頁設計排版切版有工作需求者
- 2. 網頁設計師或前端工程師提昇 CSS 基本功
CSS 網頁設計切版教學 - 課程介紹
CSS & HTML 是由 W3C 所定訂的的網頁設計排版與切版的標準，透過結構化、語意化的 HTML 使網頁語法變得非常簡潔，更容易讀取，更容易維護，您會十分訝異網頁語法居然可以變得如此的乾淨！透過標準的 CSS & HTML 所編排的網頁 UI 版型將會比傳統表格所編排出來的網頁更小，讀取速度更快，編排及維護的速度更是明顯的提昇。語意化的 HTML 更可以達到 SEO 優化、搜尋引擎最佳化、網頁搜尋排名提昇的效果，讓您的網頁更容易被搜尋到，搜尋排名大大的提昇！
CSS 的排版技巧和切版功能遠遠超越以前傳統表格網頁的限制，CSS 有更多的網頁排版和切版技巧，更多的網頁優化方法，不需要像傳統表格網頁設計需要將圖片切割的十分零碎，CSS 只要透過短短的語法就可以達到更好更快速的網頁排版效果喔！絕對是現代網頁設計師必學的技能！
CSS 網頁設計切版教學 - 課程大綱
老師會因應職場的需求變化，做課程內容和範例的即時調整與修改，確保本課程的實用性和即時性。
【教學主題一】CSS語法結構&基本指令
- 內部CSS & 外部CSS
- 標籤選取器
- 擬態選取器
- 文字編排樣式
- 標題樣式與 SEO優化
- CSS 的繼承屬性
- HTML5 語意化標籤
- W3C 標準的 HTML5 語意化
- ID選取器 & CLASS選取器
- 後代選取器
- 背景樣式的進階設定
- 超連結 CSS 樣式的進階設定
- 用 CSS 設計網頁 UI 選單
- <div> 網頁結構的規劃分析
【教學主題二】圖形化區塊的應用
- 行內元素 & 區塊元素
- display:block; 應用技巧
- 如何正確適當使用 HTML 標籤語意
- HTML SEO 優化搜尋排名、網頁優化
- position 座標定位技巧
- 各種 CSS 滑鼠變換選單的效果
- <ul> <li> 條列表樣式進階應用
- CSS & HTML 最佳初始化設定
- CSS 影像取代的技巧
- margin & padding 正確使用時機
- float 浮動定位排版技巧
- Flex Box 排版技巧
- 伸縮式 CSS 按鈕選單 UI 的設計
- 如何優化 CSS 語法
【教學主題三】CSS定位&排版
- 如何規劃網頁版型 <div> 區塊
- <div> & <span> 整合應用
- float & padding 排版活用技巧
- 兩欄式、三欄式版面排版技巧
- position 座標相對定位 & 絕對定位
- clear fix 技巧
- <div>活頁式版面定位技巧
- margin 和 padding 留白定位
【教學主題四】CSS UI 排版實例應用
- 各種 CSS 選取器實做應用
- 橫向伸縮式~圖形化<div>區塊
- 伸縮式~兩欄式、三欄式版面設計
- 條列表樣式進階排版應用
- float 排版應用技巧
- float 排版的缺點與破解技巧
- 圖形化<div>區塊
- 垂直伸縮式~圖形化區塊
- 固定式~兩欄式、三欄式版型設計
- clear fix 破解技巧
- display:inline-block 排版應用技巧
- display:inline-block 的缺點與破解技巧
【教學主題五】 CSS 網頁設計其他技巧
- CSS 選取器的權重計算
- 頁首頁尾固定式<div>版面設計
- CSS 語法優化與最佳化
- 常用的 CSS Hack 破解語法
- SEO優化、搜尋引擎最佳化
- 如何精準調整文字的位置
- 精準調整網頁內容排版位置的技巧
- CSS Reset 應用方法
- CSS Sprite 應用技巧
- CSS SEO 網頁優化技巧
【教學主題六】 CSS3 語法的應用
- border-radius 圓角效果
- box-shodow 陰影設計
- text-shadow 文字陰影
- rgba() 透明度色彩的應用
- :first-child 選取器的應用
- :last-child 選取器的應用
