以下列出了所有的轉換屬性:
property
描述css
transform
適用於2d或3d轉換的元素
3transform-origin
允許您更改轉化元素位置
3d 轉換方法
函式描述
matrix3d(n,n,n,n,n,n,
n,n,n,n,n,n,n,n,n,n)
定義 3d 轉換,使用 16 個值的 4x4 轉換矩陣。
translate3d(x,y,z)
定義 3d 轉化。
translatex(x)
定義 3d 轉化,僅使用用於 x 軸的值。
translatey(y)
定義 3d 轉化,僅使用用於 y 軸的值。
translatez(z)
定義 3d 轉化,僅使用用於 z 軸的值。
scale3d(x,y,z)
定義 3d 縮放轉換。
scalex(x)
定義 3d 縮放轉換,通過給定乙個 x 軸的值。
scaley(y)
定義 3d 縮放轉換,通過給定乙個 y 軸的值。
scalez(z)
定義 3d 縮放轉換,通過給定乙個 z 軸的值。
rotate3d(x,y,z,angle)
定義 3d 旋轉。
rotatex(angle)
定義沿 x 軸的 3d 旋轉。
rotatey(angle)
定義沿 y 軸的 3d 旋轉。
rotatez(angle)
定義沿 z 軸的 3d 旋轉。
perspective(n)
定義 3d 轉換元素的透視檢視。
Web前端開發 CSS3之3D變換
2d變換僅是在電腦螢幕平面的變換,而3d變換則是空間三個方向的變換,可以是單個方向,也可以三個方向組合,3d變換用的也是transform屬性,不同的是rotate 要加上單個方向的軸系如rotatex 同時在3d變換時需要使用transform style屬性宣告使用的是 3d變換,為了讓視覺更好...
Web前端 css3 4 3D動畫
必須的兩個要素 1 動畫名 animation name 2 動畫的執行時間 animation duration 2s div hover定義動畫第一種 form.to.keyframes mingxuanbiangaole 最終結束 to 第二種 百分比 keyframes mingxuanbi...
web前端學習之CSS
書寫樣式和引入方法 css cascading style sheets 全程為層疊樣式表,它主要用於定義html內容在瀏覽器內的顯示樣式,如文字大小 顏色 加粗等等。使用css樣式的好處是通過定義某個樣式,可以讓不同的網頁位置有著統一的字型 字型大小或者顏色等等。換言之,使用css可以有效的減少我...