[html5] 学习笔记-SVG

时间：2023-03-08 18:45:46

1、SVG介绍：什么是SVG？

1）SVG指可伸缩矢量图形（Scalable Vector Graphics）

2）SVG用来定义用于网络的基于矢量的图形

3）SVG使用XML格式定义图形

4）SVG图形在放大或改变尺寸的情况下，其图形质量不会有损失

5）SVG是万维网联盟的标准

SVG的优势？

1）SVG图像可通过文本编辑器来创建和修改

2）SVG图像可被搜索、索引、脚本化和压缩

3）SVG是可伸缩的

4）SVG图像可在任何的分辨率下被高质量的打印

5）SVG可在图像质量不下降的情况下被放大

2、SVG绘制矢量图形

 <!DOCTYPE html>
 <html>
 <head lang="en">
     <meta charset="utf-8">
     <title></title>
 </head>
 <body>
     <svg width="120" height="120" viewBox="0 0 120 120" version = "1.1">
         <circle cx = "60" cy = "50" r="50"></circle>
     </svg>
 </body>
 </html>

3、引入外部SVG文件

（待补充）

相关文章