SVGRect: x プロパティ
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
x プロパティは、要素の位置の水平座標を記述します。
使用コンテキスト
名前 | x |
---|---|
値 | <length> | <percentage> |
初期値 | 0 |
適用先 |
<mask> , 'svg', 'rect', 'image', 'foreignObject'
|
継承 | なし |
パーセント値 | 現在のビューポートの大きさを参照(単位を参照) |
メディア | 視覚 |
計算値 | 絶対長またはパーセント値 |
アニメーション | 可 |
シンプルな使用法
<coordinate> はユーザー座標系での長さで、指定された軸方向(X 座標の場合は X 軸、 Y 座標の場合は Y 軸)のユーザー座標系の原点からの距離です。構文は <length> と同じです。
html
<svg width="100" height="50" xmlns="http://www.w3.org/2000/svg">
<rect x="10" y="0" width="40" height="40" fill="blue"></rect>
</svg>
<svg width="100" height="50" xmlns="http://www.w3.org/2000/svg">
<rect x="40" y="0" width="40" height="40" fill="green"></rect>
</svg>