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>