使用背景图片时也是不支持直接设置本地图片只能使用网络图片地址或者base64位地址如果想使用svg也要转换成base64或者网络图片否则在开发者工具中是显示图片的而在手机微信预览中就无法显示图片让人疑惑require()是nodejs的写法用于导入模块、JSON和本地文件可以使用相对路径该路径可以使用路径别名命名的目录或当前工作目录进行解析。在vue中使用img时，src中引入的图片应该为图片的本身路径（相对路径或者绝对路径）vue在DOM中直接引入的图片会被转为base64格式的，因此使用require最不易出错。
使用背景图片时也是不支持直接设置本地图片只能使用网络图片地址或者base64位地址如果想使用svg也要转换成base64或者网络图片否则在开发者工具中是显示图片的而在手机微信预览中就无法显示图片让人疑惑require()是nodejs的写法用于导入模块、JSON和本地文件可以使用相对路径该路径可以使用路径别名命名的目录或当前工作目录进行解析。在vue中使用img时，src中引入的图片应该为图片的本身路径（相对路径或者绝对路径）vue在DOM中直接引入的图片会被转为base64格式的，因此使用require最不易出错。
SVG参考手册SVG元素元素说明属性创建一个SVG元素周围链接xlink:show xlink:actuate xlink:href target允许对象性文字进行控制，来呈现特殊的字符数据x y dx dy rotate glyphRef format xlink:href定义一系列象性符号的替换id定义一系列候选的象性符号的替换id随时间动态改变属性attributeName="目标属性名称" from="起始值" to="结束值" dur="持续时间" repeatCount="动画时间将发生"定义随着时间的推移颜色转换by="相对偏移值" from="起始值" to="结束值"使元素沿
SVG参考手册SVG元素元素说明属性创建一个SVG元素周围链接xlink:show xlink:actuate xlink:href target允许对象性文字进行控制，来呈现特殊的字符数据x y dx dy rotate glyphRef format xlink:href定义一系列象性符号的替换id定义一系列候选的象性符号的替换id随时间动态改变属性attributeName="目标属性名称" from="起始值" to="结束值" dur="持续时间" repeatCount="动画时间将发生"定义随着时间的推移颜色转换by="相对偏移值" from="起始值" to="结束值"使元素沿
SVG实例在线实例下面的例子是把SVG代码直接嵌入到HTML代码中。谷歌Chrome，火狐，InternetExplorer9，和Safari都支持。注意：下面的例子将不会在Opera运行，即使Opera支持SVG-它也不支持SVG在HTML代码中直接使用。SVG实例SVG基本形状一个圆矩形不透明矩形一个矩形不透明2一个带圆角矩形一个椭圆累叠而上的三个椭圆两个椭圆一条线三角形四边形一个星星另一个星星折线另一个折线路径二次贝塞尔曲线编写文字旋转文本路径上文字几行文字文本链接定义一条线，文本或轮廓颜色（stroke）定义一条线宽度，文本或轮廓（stroke-width）stroke-linecap
SVG实例在线实例下面的例子是把SVG代码直接嵌入到HTML代码中。谷歌Chrome，火狐，InternetExplorer9，和Safari都支持。注意：下面的例子将不会在Opera运行，即使Opera支持SVG-它也不支持SVG在HTML代码中直接使用。SVG实例SVG基本形状一个圆矩形不透明矩形一个矩形不透明2一个带圆角矩形一个椭圆累叠而上的三个椭圆两个椭圆一条线三角形四边形一个星星另一个星星折线另一个折线路径二次贝塞尔曲线编写文字旋转文本路径上文字几行文字文本链接定义一条线，文本或轮廓颜色（stroke）定义一条线宽度，文本或轮廓（stroke-width）stroke-linecap
SVG渐变-放射性SVG放射性渐变-元素用于定义放射性渐变。标签必须嵌套在的内部。标签是definitions的缩写，它可对诸如渐变之类的特殊元素进行定义。实例1定义一个放射性渐变从白色到蓝色椭圆：下面是SVG代码：实例 stop-opacity:0"/> 尝试一下»对于Opera用户：查看SVG文件（右键单击SVG图形预览源）。代码解析：标签的id属性可为渐变定义一个唯一的名称CX，CY和r属性定义的最外层圆和Fx和Fy定义的最内层圆渐变颜色范围可以由两个或两个以上的颜色组成。每种颜色用一个标签指定。offset属性用来定义渐变色开始和结束填充属性
SVG渐变-放射性SVG放射性渐变-元素用于定义放射性渐变。标签必须嵌套在的内部。标签是definitions的缩写，它可对诸如渐变之类的特殊元素进行定义。实例1定义一个放射性渐变从白色到蓝色椭圆：下面是SVG代码：实例 stop-opacity:0"/> 尝试一下»对于Opera用户：查看SVG文件（右键单击SVG图形预览源）。代码解析：标签的id属性可为渐变定义一个唯一的名称CX，CY和r属性定义的最外层圆和Fx和Fy定义的最内层圆渐变颜色范围可以由两个或两个以上的颜色组成。每种颜色用一个标签指定。offset属性用来定义渐变色开始和结束填充属性
SVG渐变-线性SVG渐变渐变是一种从一种颜色到另一种颜色的平滑过渡。另外，可以把多个颜色的过渡应用到同一个元素上。SVG渐变主要有两种类型：LinearRadialSVG线性渐变-元素用于定义线性渐变。标签必须嵌套在的内部。标签是definitions的缩写，它可对诸如渐变之类的特殊元素进行定义。线性渐变可以定义为水平，垂直或角渐变：当y1和y2相等，而x1和x2不同时，可创建水平渐变当x1和x2相等，而y1和y2不同时，可创建垂直渐变当x1和x2不同，且y1和y2不同时，可创建角形渐变实例1定义水平线性渐变从黄色到红色的椭圆形：下面是SVG代码：实例svgxmlns="http://www
SVG渐变-线性SVG渐变渐变是一种从一种颜色到另一种颜色的平滑过渡。另外，可以把多个颜色的过渡应用到同一个元素上。SVG渐变主要有两种类型：LinearRadialSVG线性渐变-元素用于定义线性渐变。标签必须嵌套在的内部。标签是definitions的缩写，它可对诸如渐变之类的特殊元素进行定义。线性渐变可以定义为水平，垂直或角渐变：当y1和y2相等，而x1和x2不同时，可创建水平渐变当x1和x2相等，而y1和y2不同时，可创建垂直渐变当x1和x2不同，且y1和y2不同时，可创建角形渐变实例1定义水平线性渐变从黄色到红色的椭圆形：下面是SVG代码：实例svgxmlns="http://www
