SVG（Scalable Vector Graphics，可缩放矢量图形）是一种基于XML的二维矢量图形格式，由W3C制定标准，支持无限缩放而不失真，广泛应用于网页图标、图表、动画和响应式设计。 与位图（如PNG、JPEG）不同，SVG使用数学描述（点、线、曲线和形状）来渲染图像，因此文件体积小、加载快，且可通过CSS和JavaScript动态交互。SVG还支持滤镜、渐变、遮罩和文本，是现代前端开发中不可或缺的图形工具。

【常见问题】

问题1：SVG文件的主要优势是什么？

回答1：SVG文件的主要优势在于其矢量特性，可无限缩放而不损失画质，同时文件体积小、加载速度快，支持CSS样式和JavaScript交互，适合响应式网页设计。

问题2：SVG与Canvas在实际应用中如何选择？

回答2：SVG适合处理静态或低交互的矢量图形（如图标、地图），每个元素都是DOM节点，便于事件绑定；Canvas适合高帧率动画或大量像素操作（如游戏、数据可视化），但无DOM结构。

问题3：如何优化SVG文件以提升网页性能？

回答3：可通过移除冗余代码、压缩路径数据、使用SVGO等工具进行优化，减少文件大小；同时考虑将SVG内联到HTML中减少HTTP请求，或使用CSS精灵技术。

问题4：SVG支持哪些浏览器？

回答4：所有现代浏览器（Chrome、Firefox、Safari、Edge）及IE9及以上版本均支持SVG，移动端兼容性良好，无需额外插件。

问题5：能否在SVG中使用动画？

回答5：可以，SVG支持通过CSS动画、SMIL（同步多媒体集成语言）或JavaScript实现路径动画、形变动画、透明度变换等，且性能优于位图动画。