border-radius在SVG图形上的应用方法

avatar
作者
猴君
阅读量:5

在SVG图形中,可以使用<rect>元素来创建矩形,并通过设置rxry属性来实现border-radius的效果。其中,rx属性用于设置矩形的水平圆角半径,ry属性用于设置矩形的垂直圆角半径。

示例代码如下所示:

<svg width="100" height="100">   <rect x="10" y="10" width="80" height="80" rx="10" ry="10" fill="blue" /> </svg> 

在上面的示例中,创建了一个蓝色的矩形,宽度为80,高度为80,并且设置了水平和垂直圆角半径为10,实现了border-radius的效果。您可以根据需要调整rxry属性的值来改变圆角的大小。

广告一刻

为您即时展示最新活动产品广告消息,让您随时掌握产品活动新动态!