CSS3

：

CSS関数

：

translateZ()

　 編集：2022.07.09 by T.A.

[Edge]○。→●、mdn

Z方向移動。

translateZ( <length> )

与えられた値 <length> が意味する tz による移動量ベクター [0, 0, tz] による、Z 方向の 3D 並進を指定する。 

<IMG src="Com/Picture.jpg" style="
 transform:perspective(500px) translateZ(50px);
">
perspectiveを先に指定しないとだめだった 

<IMG src="Com/Picture.jpg" style="
 transform:perspective(500px) translateZ(-50px);
">
perspectiveを先に指定しないとだめだった

関連

perspective()。translate()、translateX()、translateY()。translate3d()、translateZ()。

transform。

テスト
HTML：

ここに表示
HTML：

ここに表示
スクリプト：


スクリプト：



表示内容：
表示内容：