rx
Thuộc tính rx xác định bán kính trên trục x.
Bạn có thể dùng thuộc tính này với các phần tử SVG sau:
Ví dụ
<svg viewBox="0 0 300 200" xmlns="http://www.w3.org/2000/svg">
<ellipse cx="50" cy="50" rx="0" ry="25" />
<ellipse cx="150" cy="50" rx="25" ry="25" />
<ellipse cx="250" cy="50" rx="50" ry="25" />
<rect x="20" y="120" width="60" height="60" rx="0" ry="15" />
<rect x="120" y="120" width="60" height="60" rx="15" ry="15" />
<rect x="220" y="120" width="60" height="60" rx="150" ry="15" />
</svg>
ellipse
Với <ellipse>, rx xác định bán kính theo trục x của hình. Với giá trị nhỏ hơn hoặc bằng 0, ellipse sẽ không được vẽ.
| Giá trị |
<length>
|
<percentage>
| auto
|
|---|---|
| Giá trị mặc định | auto |
| Có thể animate | Có |
Note:
Bán kính theo trục x của <ellipse> cũng có thể được xác định bằng thuộc tính hình học rx. Nếu được đặt trong CSS, giá trị thuộc tính rx sẽ ghi đè giá trị thuộc tính rx.
rect
Với <rect>, rx xác định bán kính theo trục x của ellipse được dùng để bo tròn các góc của hình chữ nhật.
Cách giá trị của thuộc tính rx được diễn giải phụ thuộc vào cả thuộc tính ry và chiều rộng của hình chữ nhật:
- Nếu có giá trị được chỉ định đúng cho
rxnhưng không chory(hoặc ngược lại), thì trình duyệt sẽ coi giá trị bị thiếu bằng với giá trị đã được xác định. - Nếu cả
rxlẫnryđều không có giá trị được chỉ định đúng, thì trình duyệt sẽ vẽ một hình chữ nhật có các góc vuông. - Nếu
rxlớn hơn một nửa chiều rộng của hình chữ nhật, thì trình duyệt sẽ coi giá trị củarxbằng một nửa chiều rộng của hình chữ nhật.
| Giá trị |
<length>
|
<percentage>
| auto
|
|---|---|
| Giá trị mặc định | auto |
| Có thể animate | Có |
Note:
Độ cong ngang ở các góc của <rect> cũng có thể được xác định bằng thuộc tính hình học rx. Nếu được đặt trong CSS, giá trị thuộc tính rx sẽ ghi đè giá trị thuộc tính rx.
Thông số kỹ thuật
| Thông số kỹ thuật |
|---|
| Scalable Vector Graphics (SVG) 2 # RX |
Xem thêm
- Thuộc tính CSS
rx