SVGRectElement：rx 屬性
SVGRectElement 介面的只讀屬性 rx，用於描述 SVG 矩形角的水平曲率，其型別為 SVGAnimatedLength。長度單位為使用者座標系單位，沿 x 軸方向。其語法與 <length> 相同。
它反映了 <rect> 元素的 rx 表示屬性。CSS rx 屬性優先於 SVG rx 表示屬性，因此該值可能無法反映圓角的實際大小。預設值為 0，表示繪製一個帶有直角的矩形。
值
一個 SVGAnimatedLength 物件。
示例
給定以下 SVG
html
<svg viewBox="0 0 300 200" xmlns="http://www.w3.org/2000/svg">
<rect x="0" y="0" width="60" height="60" rx="15" ry="15" />
<rect x="60" y="0" width="60" height="60" rx="15%" ry="15" />
</svg>
我們可以訪問 rx 屬性的計算值
js
const rectangles = document.querySelectorAll("rect");
const rxSize0 = rectangle[0].rx;
const rxSize1 = rectangle[1].rx;
console.log(rxSize0.baseVal.value); // output: 15 (the value of `rx`)
console.log(rxSize1.baseVal.value); // output: 45 (15% of 300)
規範
| 規範 |
|---|
| Scalable Vector Graphics (SVG) 2 # __svg__SVGRectElement__rx |
瀏覽器相容性
載入中…