属性名 | translate |
---|---|
値 | none | <length-percentage> [ <length-percentage> <length>? ]? |
初期値 | none |
適用可能要素 | トランスフォーム可能要素 |
継承 | しない |
サポート | https://caniuse.com/?search=translate |
transform の translate() と同様、X軸、Y軸、Z軸方向の移動を行います。値をひとつ指定するとX軸、2つ指定するとX軸とY軸、3つ指定するとX軸・Y軸・Z軸で移動します。
値 | 説明 |
---|---|
none | 移動しません。 |
<length> | 移動距離を指定します。 |
#box1 { height: 12rem; width: 12rem; border: 1px solid #999; } #img1 { translate: 4rem 4rem; scale: 2.0; rotate: 180deg; }
<div id="box1"> <img id="img1" src="../../image/juno-tora.png" alt="Tora"> </div>