| 属性名 | offset-path |
|---|---|
| 値 | none | <offset-path> || <coord-box> |
| 値の詳細 |
<offset-path> = ray(...) | <url> | <basic-shape> <coord-box> = content-box | padding-box | border-box | fill-box | stroke-box | view-box |
| 初期値 | none |
| 適用可能要素 | トランスフォーム可能要素 |
| 継承 | 継承しない |
| サポート | https://caniuse.com/?search=offset-path |
モーションパス のパスを指定します。
ray(...) を参照してください。<path> や <polygon> などでシェイプを定義したSVGファイルを指定します。circle() や path() などの描画関数を指定します。詳細は clip-path を参照してください。mask-origin を参照してください。使用例は CSSモーションパス を参照してください。
ray(<angle> && <ray-size>? && contain? && [at <position>]? ) <ray-size> = closest-side | closest-corner | farthest-side | farthest-corner | sides
<position> を起点として <angle> の方向(上方向を0度として時計まわり)に向かう、長さ <ray-size> の放射線をパスとします。contain を指定するとオブジェクトが領域からはみ出さない範囲で移動します。
使用例は モーションパス: ray() を参照してください。