在css3中,可利用transform屬性實(shí)現(xiàn)元素平移效果,當(dāng)該屬性的值設(shè)置為“translate(x,y)”時可沿x軸和y軸平移元素,為“translateX(x)”時可沿x軸平移元素,為“translateY(y)”時可沿y軸平移元素。
本教程操作環(huán)境:windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。
在css3中,可利用transfrom屬性實(shí)現(xiàn)元素平移效果。
Transform屬性應(yīng)用于元素的2D或3D轉(zhuǎn)換。這個屬性允許你將元素旋轉(zhuǎn),縮放,移動,傾斜等。
Transform屬性實(shí)現(xiàn)平移有三個值:
-
translate(x,y) 定義 2D 轉(zhuǎn)換,沿x軸和y軸平移元素。
-
translateX(x) 定義轉(zhuǎn)換,沿x軸平移元素。
-
translateY(y) 定義轉(zhuǎn)換,沿y軸平移元素。
我們使用translate這個參數(shù)來實(shí)現(xiàn)移動
-
translate(x,y):沿x軸和y軸平移
-
translateX:向X軸平移,填正數(shù)往右平移,填負(fù)數(shù),往左平移
-
translateY :向Y軸平移,填正數(shù)往下平移,填負(fù)數(shù),往上平移