1. 程式人生 > >CSS3的transform以及3D相關屬性總結

CSS3的transform以及3D相關屬性總結

則其子元素,設定的translateZ值越小,則子元素大小越小(因為元素遠去,我們眼睛看到的就會變小);translateZ值越大,該元素也會越來越大,當translateZ值非常接近201畫素,但是不超過201畫素的時候(如200畫素),該元素的大小就會撐滿整個螢幕(如果父輩元素沒有類似overflow:hidden的限制的話)。因為這個時候,子元素正好移到了你的眼睛前面,所謂一葉蔽目,不見泰山,就是這麼回事。當translateZ值再變大,超過201畫素的時候,該元素看不見了——這很好理解:我們是看不見眼睛後面的東西的!translateZ, 當translateZ為正值的時候,元素會向其面對的方向走去;如果元素無旋轉,就會朝顯示器走來。(該段摘自
http://www.zhangxinxu.com/wordpress/2012/09/css3-3d-transform-perspective-animate-transition/