transform屬性,讓乙個元素在座標系統中變形,這個屬性會包含一系列的變形函式,可以移動,旋轉和縮放元素;
相容性:ie10+ 、 firefox16、 chrome36 、 safari9 、opera12.1;
旋轉rotate
移動translate
translate(x,y) – 水平方向和垂直方向同時移動(x軸移動和y軸移動)
引數值說明:
縮放scale
scaley()元素垂直方向縮放
使用[1,sy]縮放向量執行縮放操作的,sy為所需引數
語法:transfrom: scaley(< number>);
引數說明:
scale(x,y)元素水平方向和垂直方向同時縮放
使用[sx,sy]縮放向量的兩個引數指定乙個2d縮放;
語法:transfrom: scale([< number>]);
引數說明:
扭曲skew
skewy(y)元素在垂直方向扭曲變形
按給定的角度沿著y軸指定乙個斜切變換;
語法:transform: skewy(角度);
引數說明:
skew(x,y)元素在水平方向和垂直方向扭曲變形
按給定的角度沿著y軸和x軸指定乙個斜切變換;
語法:transform: skew(角度,[角度]);
旋轉rotate x()
旋轉rotate y()
旋轉rotate z()
旋轉rotate 3d()
移動translatez
移動translate3d
縮放scalez()
縮放scale3d()
transform-origin屬性
perspective屬性
perspective-origin屬性
backface-visibility屬性
HTML 從零開始的學習過程 1
1.html的概念 html hyper text markup language 超文字標記語言,使用一系列的標籤對文件 圖示以及其他資訊資源進行統一關聯。特點 1.不需要編譯,直接由瀏覽器執行 2.文字檔案 3.檔案字尾名為html 4.對大小寫不敏感。2.html基礎語法部分 基本結構 doc...
HTML 從零開始的學習過程(3)
結構 標題 caption 表頭 th 頭,內容居中顯示,加粗顯示 tr thead 主體 td 表體,預設靠左顯示,不加粗 tr tbody table 腳注 td 表體,預設靠左顯示,不加粗 tr tfoot body 屬性 frame 外部邊框樣式 void,不顯示外側邊框 above,顯示上...
HTML 從零開始的學習過程(5)
概念 css層疊樣式表 cascading style sheets 一種用來表現html或xml的語言。作用 結構與樣式分離的方式,便於後期的維護和修改 可以用多套樣式,使網頁有任意樣式切換的效果 使得頁面載入的更快,降低伺服器的成本。樣式分類 1.內部樣式 utf 8 document titl...