CSS3translate是CSS3中重要的一個功能，它可以使網(wǎng)頁中的元素進行平移操作，實現(xiàn)更加細致的元素布局，讓網(wǎng)頁更加美觀。最近，CSS3translate又更新了，新增了一些功能，下面我們來看一下。

/*使用translate進行平移*/
div{
transform: translate(x,y);
}
/*如果只想進行x軸平移或y軸平移，可以單獨使用*/
div{
transform: translateX(x);
transform: translateY(y);
}
/*如果需要進行3D平移，可以使用translate3d*/
div{
transform: translate3d(x,y,z);
}
/*還可以使用translateX()、translateY()、translateZ()分別進行單軸平移*/

除了上面介紹的一些基本使用方式外，CSS3translate還新增了一些功能，讓我們來一一看一下：

/*使用%進行平移*/
div{
transform: translate(50%,50%);
}
/*使用calc()進行復(fù)雜計算*/
div{
transform: translate(calc(50% - 50px),10%);
}
/*鼠標懸停時進行平移*/
div:hover{
transform: translate(50%,50%);
}
/*平移結(jié)束后進行動畫效果慢慢消失*/
div{
transition: transform 0.5s;
}

以上就是CSS3translate更新的一些使用方式，期待大家可以好好利用這些新功能，讓自己的網(wǎng)頁更加炫酷吧！