《CSS3最新版參考手冊》為官方CSS3線上參考學習手冊，本css3線上開發手冊包含了各種css3屬性、語法、定義、使用方法，實例運作等，是網頁前端學習者及開發者不可或缺的線上查詢手冊文件！註：CSS3是CSS技術的升級版本，CSS3語言開發是朝向模組化發展的，這些模組包括： 盒子模型、列表模組、超連結方式、語言模組、背景和邊框、文字特效、多欄佈局等。
CSS3是CSS（層疊樣式表）技術的升級版本，於1999年開始訂訂，2001年5月23日W3C完成了CSS3的工作草案，主要包括盒子模型、列表模組、超連結方式、語言模組、背景和邊框、文字特效、多欄佈局等模組。
CSS演進的一個主要變化就是W3C決定將CSS3分成一系列模組。瀏覽器廠商按CSS節奏快速創新，因此透過採用模組方法，CSS3規範裡的元素能以不同速度向前發展，因為不同的瀏覽器廠商只支援給定特性。
但不同瀏覽器在不同時間支援不同特性，這也讓跨瀏覽器開發變得複雜 。
CSS用來控制網頁的樣式和版面。 CSS3則是最新的 CSS 標準。
CSS3語言基礎
CSS3的語法是建立在CSS原先版本基礎上的，它允許使用者在標籤中指定特定的HTML元素而不必使用多餘的class、ID或JavaScript。
CSS選擇器中的大部分並不是在CSS3中新添加的，只是在先前的版本中沒有廣泛的應用。
如果想嘗試實現一個乾淨的、輕量級的標籤以及結構與表現更好的分離，高級選擇器是非常有用的，它們可以減少在標籤中的class和ID的數量並讓設計師更方便地維護樣式表。
建立並執行第一個CSS3實例
實例
<!DOCTYPE html>
<html>
<head>
<style>
div
{
width:100px;
height:75px;
background-color:yellow;
border:1px solid black;
}
div#div2
{
transform:rotate(30deg);
-ms-transform:rotate(30deg); /* IE 9 */
-moz-transform:rotate(30deg); /* Firefox */
-webkit-transform:rotate(30deg); /* Safari and Chrome */
-o-transform:rotate(30deg); /* Opera */
}
</style>
</head>
<body>
<div>你好。这是一个 div 元素。</div>
<div id="div2">你好。这是一个 div 元素。</div>
</body>
</html>執行實例»
點擊"運行實例" 按鈕查看線上實例
是不是非常簡單有趣！ CSS3原理同CSS，是在網頁中自訂樣式表的選擇符，然後在網頁中大量引用這些選擇符。
提示：我們的CSS3教學將幫助您逐步學習了解CSS3中的新功能以及如何同時控制多重網頁的樣式和佈局。如果你有任何疑問，請前往PHP中文網CSS3社群提出你的問題，會有熱心網友為你解答。
CSS3優勢
#減少開發成本與維護成本
在CSS3出現之前，開發人員為了實現一個圓角效果，往往需要額外的HTML標籤，使用一個或多個圖片來完成，而使用CSS3只需要一個標籤，利用CSS3中的border-radius屬性就能完成。
這樣，CSS3技術能把人員從繪圖、切圖和優化圖片的工作中解放出來。
如果後續需要調整這個圓角的弧度或圓角的顏色，使用CSS2.1，需要從頭繪圖、切圖才能實現，使用CSS3只要修改border-radius屬性值就可快速完成修改。
CSS3提供的動畫特性，可讓開發者在先實作一些動態按鈕或動態導航時遠離JavaScript，讓開發人員不需要花費大量的時間去寫腳本或尋找合適的腳本外掛程式來適配一些動態網站效果。
提高頁面性能
很多CSS3技術透過提供相同的視覺效果而成為圖片的“替代品”，換句話說，在進行網頁開發時，減少多餘的標籤嵌套以及圖片的使用數量，意味著使用者要下載的內容將會更少，頁面載入也會更快。
另外，更少的圖片、腳本和Flash檔案能夠減少使用者造訪Web網站時的HTTP請求數，這是提升頁面載入速度的最佳方法之一。而使用CSS3製作圖形化網站無需任何圖片，大幅減少了HTTP的請求數量，並且提升了頁面的載入速度。
例如CSS3的動畫效果，能夠減少對JavaScript和Flash檔案的HTTP請求，但可能會要求瀏覽器執行很多的工作來完成這個動畫效果的渲染，這有可能導致瀏覽器響應緩慢致使用戶流失。
因此，在使用一些複雜的特效時需要考慮清楚。其實很多CSS3技術能夠在任何情況下都大幅提升頁面的效能 。
CSS3將完全向後相容，所以沒有必要修改的設計來讓它們繼續運作。網頁瀏覽器也也將繼續支援CSS2。
本CSS3教程手冊涵蓋的內容
本CSS3教程手冊涵蓋了所有CSS3新特性，包含瞭如圓角效果、圖形化邊界、塊陰影與文字陰影、使用RGBA實現透明效果、漸層效果、使用@Font-Face實現定製字體、多背景圖、文字或圖像的變形處理（旋轉、縮放、傾斜、移動）、多欄佈局、媒體查詢等新功能的介紹及運行實例。
提示：本教學的每一章都包含了許多CSS3實例，您可以直接點擊 "運行實例" 按鈕在線查看運行結果。這些例子將幫助您更好地理解和使用CSS3新特性。
其它CSS3相關學習參考資源
除了本頁右邊的知識拓展，也為大家精選了以下資源
####################################### #####CSS每日程式設計小知識##################常用的CSS命名規格大總結，非常實用（收藏）######### ##########前端學習路線：如何成為優秀的前端開發人員！ ################最新章節
- CSS3 多媒体查询实例 2016-10-18
- CSS3 多媒体查询 2016-10-18
- CSS3 弹性盒子 2016-10-18
- CSS3 框大小 2016-10-18
- CSS 分页 2016-10-18
- CSS 按钮 2016-10-18
- CSS 图片 2016-10-18
- CSS3 用户界面 2016-10-18
相關課程
- Web前端開發極速入門 2021-12-10
- 最懂你的大前端課：HTML5/CSS3/ES6/NPM/Vue/...【原文】 2022-09-30
- Gulp入門影片教學 2022-04-18
- 兄弟連高洛峰CSS3影片教程 2022-04-20
- AngularJS開發Web應用程式基礎實例影片教學 2022-04-18
- Ajax全接觸 2022-04-13
- MUI框架基礎影片教學 2022-04-13
- 線上訓練班試聽課 2019-01-10