svg是一种用于创建可缩放、分辨率无关图形的图形格式。其优势包括：可缩放：svg图像可以缩放至任意大小而不会失真。分辨率无关：svg图像在任何设备或屏幕上都将保持清晰。交互性：svg元素可以添加交互性，例如单击事件和动画。易于编辑：svg图像可以用文本编辑器轻松编辑。
使用 SVG 绘制页面
SVG（可缩放矢量图形）是一种基于 XML 的图形格式，可用于创建可缩放、分辨率无关的图形。它广泛用于 Web 开发中，因为它可以创建清晰、可操作的图像。
使用 SVG 的优点
- 可缩放：SVG 图像可以缩放至任意大小而不会失真。
- 分辨率无关：SVG 图像在任何设备或屏幕上都将保持清晰。
- 交互性：SVG 元素可以添加交互性，例如单击事件和动画。
- 易于编辑：SVG 图像可以用文本编辑器轻松编辑。
在 HTML 中使用 SVG
立即学习“前端免费学习笔记（深入）”；
要将 SVG 图像添加到 HTML 文档，可以使用 <svg></svg> 元素。<svg></svg> 元素包含 <path></path>、<circle></circle> 和 <text></text> 等 SVG 元素，这些元素用于创建图像。
以下示例显示了如何在 HTML 中使用 <svg></svg> 元素：
<code class="html"><svg width="100px" height="100px"> <circle cx="50" cy="50" r="40" fill="red" /> </svg></code>
具体步骤
- 创建一个
<svg></svg>元素，并设置所需的宽度和高度。 - 使用 SVG 元素创建所需的图形。
- 保存 HTML 文件。
- 在浏览器中打开 HTML 文件以查看 SVG 图像。
其他资源
- [SVG 教程](https://www.w3schools.com/graphics/svg_intro.asp)
- [SVG 文档](https://developer.mozilla.org/en-US/docs/Web/SVG)
