簡介:本課程為CSS3教程,對于有一定CSS2經驗的伙伴,能讓您系統的學習CSS3,快速的理解掌握并應用于工作之中。在學習教程的過程中實例演示結合在線編程完成任務的方式來學習,相信自己動手會讓你理解的更快,本教程能夠讓您學習效果更好!
第2章 邊框
本課程主要講解border-color 、border-image 、border-radius 及box-shadow 相關知識
第3章 顏色相關
學習CSS3中與顏色有關的屬性,包括RGBA colors和Gradient,來實現在此之前只能通過其它手段如背景圖片才能得到的絢麗效果。
第4章 文字與字體
本章學習CSS3中文字相關的屬性,包括text-shadow、text-overflow和嵌入字體等,通過CSS來實現多變的網頁字體效果。
第5章 與背景相關的樣式
講解與背景相關的新增屬性。background-origin background-clip background-size multiple backgrounds
第6章 征服CSS3選擇器(上)
靈活運用強大的CSS3選擇器,學會選擇器的使用,可以直接將樣式與元素綁定起來,之前我們需要使用JavaScrip實現的功能,現在只需要用CSS3就能輕松搞定。
- 編程: 6-1 CSS3選擇器 屬性選擇器
- 編程: 6-2 CSS3 結構性偽類選擇器—root
- 編程: 6-3 CSS3 結構性偽類選擇器—not
- 編程: 6-4 CSS3 結構性偽類選擇器—empty
- 編程: 6-5 CSS3 結構性偽類選擇器—target
- 編程: 6-6 CSS3 結構性偽類選擇器—first-child
- 編程: 6-7 CSS3 結構性偽類選擇器—last-child
- 編程: 6-8 CSS3 結構性偽類選擇器—nth-child(n)
- 編程: 6-9 CSS3 結構性偽類選擇器—nth-last-child(n)
- 編程: 6-10 CSS3 first-of-type選擇器
- 編程: 6-11 CSS3 nth-of-type(n)選擇器
- 編程: 6-12 CSS3 last-of-type選擇器
- 編程: 6-13 CSS3 nth-last-of-type(n)選擇器
- 編程: 6-14 CSS3 only-child選擇器
- 編程: 6-15 CSS3 only-of-type選擇器
第7章 征服CSS3選擇器(下)
UI元素狀態偽類選擇器也是CSS3選擇器模塊組中的一部分,此類選擇器主要運用于form表單元素上,用來提高網頁的人機交互、操作邏輯以及頁面的整體美觀。
第8章 CSS3中的變形與動畫(上)
徹底分清 Transform 、Transition、 Animations 三兄弟
- 編程: 8-1 CSS3變形--旋轉 rotate()
- 編程: 8-2 CSS3中的變形--扭曲 skew()
- 編程: 8-3 CSS3中的變形--縮放 scale()
- 編程: 8-4 CSS3中的變形--位移 translate()
- 編程: 8-5 CSS3中的變形--矩陣 matrix()
- 編程: 8-6 CSS3中的變形--原點 transform-origin
- 編程: 8-7 CSS3中的動畫--過渡屬性 transition-property
- 編程: 8-8 CSS3中的動畫--過渡所需時間 transition-duration
- 編程: 8-9 CSS3中的動畫--過渡函數 transition-timing-function
- 編程: 8-10 CSS3中的動畫--過渡延遲時間 transition-delay
第9章 CSS3中的變形與動畫(下)
animation實現動畫效果主要由兩個部分組成:首先通過類似Flash動畫中的關鍵幀來聲明一個動畫,然后在animation屬性中調用關鍵幀聲明的動畫,從而實現一個更為復雜的動畫效果。
第10章 布局樣式相關
多欄布局、盒布局、盒模型
第11章 Media Queries 與Responsive 設計
傳說中的響應式設計,根據瀏覽器的窗口大小選擇使用不同的樣式。
第12章 用戶界面與其它重要屬性
輪廓相關樣式、resize屬性、initial屬性