一、 注意web
-webkit- 對於Safari 5 以及更老的版本或chrome有時須要前綴 -webkit-。chrome
-o- Opera瀏覽器。瀏覽器
-moz- 兼容老的firefox服務器
二、佈局
CSS3 被劃分爲模塊。字體
其中最重要的 CSS3 模塊包括：動畫
選擇器spa
框模型firefox
背景和邊框設計
文本效果
2D/3D 轉換
動畫
多列布局
用戶界面
三、
邊框
border-radius 設置邊框圓角的半徑
box-shadow 設置陰影效果
border-image 設置邊框圖片
4、
背景
background-origin 設置背景圖片的位置 context-box border-box padding-box
background-size 設置背景圖片的拉伸大小
5、
文本效果
text-shadow 文字陰影
word-wrap 自動換行
設置顯示點點點....
{
white-space:nowrap;
width:12em;
overflow:hidden;
border:1px solid #000000;
text-overflow: ellipsis;
}
6、字體
經過 CSS3，web 設計師能夠使用他們喜歡的任意字體。
當您您找到或購買到但願使用的字體時，可將該字體文件存放到 web 服務器上，它會在須要時被自動下載到用戶的計算機上。
您「本身的」的字體是在 CSS3 @font-face 規則中定義的。
7、轉換
transform
2D 轉換方法：
translate() 移動
rotate() 旋轉
scale() 寬度高度成倍擴大
skew() 翻轉
matrix()
3D 轉換方法：
rotateX()
rotateY()
8、過渡
transition
能夠與transform結合着使用
9、動畫
@keyframes 規則用於建立動畫。在 @keyframes 中規定某項 CSS 樣式，就能建立由當前樣式逐漸改成新樣式的動畫效果。
將規則綁定到元素上用animation
注意瀏覽器的兼容性
10、多列
多列屬性：
column-count
column-gap
column-rule
11、用戶界面
用戶界面屬性：
resize
box-sizing
outline-offset