<svg width="200" height="100" xmlns="http://www.w3.org/2000/svg">
<!-- 矩形 -->
<rect width="150" height="80" fill="lightblue" />
<!-- 文本 -->
<text x="20" y="50" font-family="Arial" font-size="16" fill="black">Hello, SVG!</text>
</svg>
在这个例子中:
- <svg> 元素定义了SVG图形的画布,指定了宽度(width)和高度(height)。
- <rect> 元素定义了一个矩形,使用 width 和 height 属性设置其宽度和高度,使用 fill 属性设置填充颜色。
- <text> 元素定义了文本,使用 x 和 y 属性设置文本的起始位置,使用 font-family、font-size 和 fill 属性设置字体、字号和颜色。
你可以将这段SVG代码嵌入到HTML文档中,或者将其保存为独立的SVG文件。当你在浏览器中打开包含SVG的HTML文件时,应该能够看到一个带有矩形和文本的简单图形。
转载请注明出处:http://www.pingtaimeng.com/article/detail/14666/SVG