CSS3位移是指通過使用CSS3中的transform屬性來控制元素在網頁中的位置。在CSS3中可以通過translate()函數實現位移,并且可以通過該函數來實現元素的平移、旋轉、縮放等效果。
/* 元素沿著X軸方向向右平移50像素 */ transform: translateX(50px); /* 元素沿著Y軸方向向下平移50像素 */ transform: translateY(50px); /* 元素沿著X軸和Y軸同時平移50像素 */ transform: translate(50px,50px);
除了以上的平移操作,還可以通過translateX()、translateY()和translateZ()實現元素在3D空間中的位移操作。
/* 元素沿著Z軸方向向外平移50像素 */ transform: translateZ(50px); /* 元素沿著Z軸方向向內平移50像素 */ transform: translateZ(-50px);
總之,CSS3中的transform屬性可以實現很多酷炫的位移效果,為網頁設計提供了更多的可能性。
上一篇css3修飾練習案例