网页中的图片可以分为两类，一类是小图标和简单的图形；另一类图片经常使用GIF、JPEG、PNG等格式，这些格式比较常见，但因为都是基于像素处理的，当放大时会失真，变得模糊。
可缩放矢量图形（Scalable Vector Graphics，SVG）是一种开放标准的描述矢量图形的语言，它基于XML（可扩展标记语言）。在2003年1月，SVG 1.1被确立为W3C（万维网联盟）标准。
SVG使用标签的方式定义各种图形，外层标签是<svg>，viewBox可以定义用来观察SVG视图的一个矩形区域，它的属性主要包括x、y、width、height，用数字表示，每个数字之间用空格或逗号隔开，表示定义一个在左上角(x, y)坐标位置，宽度为width，高度为height的矩形。
在<svg>标签的内部，可以使用SVG提供的一些预定义的标签来绘制图形，或者绘制文字,
常用的内部标签如表所示：
SVG常用的内部标签还可以通过属性来设置样式：
<body>
<svg width="100%" height="100%">
<circle cx="100" cy="50" r="40"
stroke="black" stroke-width="2" fill="#ddd">
</svg>
</body>
从外部引入SVG文件：
<body>
<img src="circle.svg" alt="">
</body>
定义circle.svg文件，并进行XML声明，其中standalone属性用来规定此SVG文档是“独立的”还是含有对外部文件的引用，此处设为no表示该SVG文档会引用一个外部文件（即第2行的DTD文件）。引用了外部的SVG的DTD文件，此处引用的是W3C提供的svg11.dtd，表示含有所有允许的SVG元素。
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
在circle.svg文件中添加代码，为<svg>标签添加了version（SVG版本）和xmlns（XML命名空间）属性，用来在XML文档中使用，并定义<circle>圆形。
来千语创想移动低代码开发平台学习更多APP开发知识：app开发，app制作，app开发源码下载，app开发框架，app开发工具等免费获取。
千语创想-专业APP开发、app定制服务商，提供一站式移动应用解决方案，满足您的各类需求，欢迎免费评估需求和获取报价。
立即免费在线制作一个APP，新手注册即送开发大礼包
提交app定制需求，免费获取报价和周期：
电脑请点击https://www.qianyuthink.com/?url=/index?uzchannel=500
手机请点击https://www.qianyuthink.com/?url=/m/customizedservice?uzchannel=500
