【飛肯設計學苑】電腦教育教學中心
教學課程及範例下載，還有photoshop教學、css語法教學、dreamweaver教學、flash actionscript教學、網頁設計教學...等
課程名稱：CSS語法 div版面設計專修班
- 課程梯次：9 月一三五晚班
- 課程日期：2008 年 9 月 15 日 ~ 9 月 29 日
- 課程時間：週一、週三、週五 / 晚上 6:50 ~ 9:50
Curriculum information
課程資訊
- 授課講師：姜智豪 老師
- 課程時數：7 堂課 / 時數共 21 小時 / 週數共 4 週
- 課程學費：7800 元【新生線上報名特價 7500 元 / 舊生報名特價 6800 元】
- 付款方式：開課當天繳費
- 課程教材：教學講義 / 範例光碟
- 課程地點：【飛肯教室】交通位置詳圖 > >
- 聯絡電話： (02)2211-1414 / 0925-014-000
Curriculum information
適合對象
- 1.對於網頁設計有興趣與需求者
- 2.網頁設計師或美術設計人員
- 3.上班族及學生族自我進修
- 4.SOHO族
Registration qualifications
報名資格
- 1.必須對基本的網頁設計有經驗者
- 2.完全沒有學過 CSS 語法的人也可以參加這個課程
Curriculum characteristic
課程特色
10人左右超小班制，面對面教學品質有保障~ 口碑看得見~ 教室電腦及網路設備完善，一人一機，有大量的範例讓同學現場練習. 上課皆附講義及光碟喔~ 報名一次，可免費申請多次重修旁聽喔！！！
「CSS 語法 - div版面設計專修班」 全課程包含100多個範例，札札實實為您鍛練好CSS語法功力！
Curriculum synopsis
課程簡介
徹底改變您對網頁設計的觀念！所有網頁設計師必修的新學分！
CSS & XHTML 是由 W3C 所定訂的全新一代的網頁設計的新標準，透過結構化的 XHTML 使網頁語法變得非常簡潔，更容易讀取，更容易維護，您會十分訝異網頁語法居然可以變得如此的乾淨！透過標準的 CSS & XHTML 所編排的網頁將會比傳統表格所編排出來的網頁更小，讀取速度更快，編排及維護的速度更是明顯的提昇。結構化的 XHTML 可以達到 SEO 搜尋引擎最佳化的效果，讓您的網頁更容易被搜尋，搜尋排名大大的提昇！另外，還可以更容易達到「無障礙網頁」的要求，讓所有的網路閱讀平台都可以正確的讀取網頁的內容。
CSS 的視覺設計效果遠遠超越傳統表格網頁的限制，更多的互動式效果，更多的視覺化編排方法，不需要像傳統表格網頁需要將圖片切割的十分零碎，CSS 只要透過短短的語法就可以達到更好更快速的編排效果喔！絕對是新一代網頁設計師必學的技能之一！
Curriculum subject
課程大綱
【主題一】CSS語法結構&基本指令
- 內部CSS & 外部CSS
- 標籤選取器
- 擬態選取器
- 文字編排樣式
- 邊框樣式
- CSS的繼承屬性
- 用CSS美化表單
- 適量使用<div>的觀念
- W3C標準的XHTML
- ID選取器 & CLASS選取器
- 關聯式選取器
- 背景樣式的進階設定
- 超連結樣式的進階設定
- 用CSS美化表格
- <div> 入門觀念
【主題二】圖形化區塊的應用
- DOCTYPE 宣告
- 行內元素 & 區塊元素
- 影像取代的技巧
- IE5 & IE6 & IE7 &Firefox
- 座標定位技巧
- 各種滑鼠指向的效果
- <ul> <li> 條列表樣式進階應用
- CSS & XHTML 最佳初始化設定
- 圖形化區塊的設計
- margin & padding
- float浮動技巧
- 各種css選單的設計
- 伸縮式 css 選單的設計
【主題三】CSS定位&排版
- 如何規劃網頁版型區塊
- CSS 與 SEO 搜尋引擎最佳化
- <div> & <span> 整合應用
- float浮動定位
- <div>網頁編排入門
- <div>兩欄式、三欄式版面定位技巧
- 表格排版與CSS排版的優缺點分析
- 無障礙網頁設計最佳化
- position相對定位 & 絕對定位
- 如何活用 clear 指令
- <div>活頁式版面定位技巧
- margin 和 padding 留白定位
【主題四】CSS排版實例應用
- 關聯式選取器進階應用
- 圓角圖形的設計技巧
- 橫向伸縮式~圖形化<div>區塊
- 活頁式<div>版面設計
- 伸縮式~兩欄、三欄版面設計
- <ul> <li> 條列表樣式進階排版應用
- 圖形化<div>區塊
- 陰影圖形的設計技巧
- 垂直伸縮式~圖形化<div>區塊
- 固定式~兩欄、三欄<div>版面設計
- 全方位伸縮式~圖形化<div>區塊
【主題五】 其他技巧
- IE6 & IE 7 & Firefox 相容性設計
- Dreamweaver Spry（JavaScript）
- 訊息式超連結區塊
- YUI 觀念解說
- IE瀏覽器的BUG解決對策
- 三種不同的區塊隱藏技巧
- 定位選單的效果