SVG中的矩形通过 <rect> 元素来表示,以下是一个简单的SVG矩形的例子:
<svg width="200" height="100" xmlns="http://www.w3.org/2000/svg">
  <!-- 矩形 -->
  <rect width="150" height="80" fill="lightblue" />
</svg>

在这个例子中:

  •  使用 <svg> 元素定义了SVG图形的画布,设置了宽度(width)和高度(height)。

  •  使用 <rect> 元素定义了一个矩形,通过 width 和 height 属性设置了矩形的宽度和高度。

  •  fill 属性设置了矩形的填充颜色为浅蓝色(lightblue)。


你可以根据需要调整矩形的大小、位置和样式。此外,你还可以使用其他属性,如 x 和 y 来指定矩形的起始位置。以下是一个包含起始位置的例子:
<svg width="200" height="100" xmlns="http://www.w3.org/2000/svg">
  <!-- 矩形,指定起始位置 -->
  <rect x="20" y="10" width="150" height="80" fill="lightblue" />
</svg>

在这个例子中,矩形的左上角起始位置被指定为 x=20,y=10。你可以根据需要调整这些值以达到期望的效果。SVG矩形是非常灵活的,可以通过调整属性来满足各种设计需求。


转载请注明出处:http://www.pingtaimeng.com/article/detail/14668/SVG