矢量图

---

实例

画一个圆：

<!文章类型 网页>
<网页>
<主体>
<标题1>矢量图 元素</标题1>
<矢量图 宽度=“100“ 高度=“100“>
<圆形 cx=“50“ cy=“50“ r=“40“ 画笔=“绿色“ 画笔-宽度=“4“ 填充=“黄色“ />
抱歉，您的浏览器不支持嵌入式 矢量图。
</矢量图>
</主体>
</网页>

---

 

浏览器支持

 

元素	Chrome	IE	Firefox	Safari	Opera
<矢量图>	4.0	9.0	3.0	3.2	10.1

---

更多实例

实例

画一个矩形：

<!文章类型 网页>
<网页>
<头部>
<兼容模式>
</头部>
<主体>
<标题1>矢量图 元素</标题1>
<矢量图 宽度=“100“ 高度=“100“>
<圆形 cx=“50“ cy=“50“ r=“40“ 画笔=“绿色“ 画笔-宽度=“4“ 填充=“黄色“ />
抱歉，您的浏览器不支持嵌入式 矢量图。
</矢量图>
</主体>
</网页>

实例

画一个带有圆角的正方形：

<!文章类型 网页>
<网页>

<头部>
<兼容模式>
</头部>
<主体>
<标题1>svg 元素</标题1>
<矢量图 宽度=“400“ 高度=“180“>
<矩形 x=“50“ y=“20“ rx=“20“ ry=“20“ 宽度=“150“ 高度=“150“ 样式=“填充:红色;画笔:黑色;画笔-宽度:5;透明度:0.5“ />
抱歉，您的浏览器不支持嵌入式 svg。
</矢量图>
</主体>
</网页>

实例

画一个星：

<!文章类型 网页>
<网页>

<头部>
<兼容模式>
</头部>
<主体>
<标题1>矢量图 元素</标题1>
<矢量图 宽度=“300“ 高度=“200“>
<多边形 顶点=“100,10 40,198 190,78 10,78 160,198“
样式=“填充:酸橙色;画笔:紫色;画笔-宽度:5;填充-规则:奇偶;“ />
抱歉，您的浏览器不支持嵌入式 矢量图。
</矢量图>
</主体>
</网页>

实例

画一个 矢量图 图标：

<!文章类型 网页>
<网页>

<头部>
<兼容模式>
</头部>
<主体>
<标题1>矢量图 元素</标题1>
<矢量图 高度=“130“ 宽度=“500“>
<定义>
<匀速渐变 标识=“变化“ x1=“0%“ y1=“0%“ x2=“100%“ y2=“0%“>
<停止 抵消=“0%“
样式=“停止-颜色:红绿蓝(255,255,0);停止-透明度:1“ />
<停止 抵消=“100%“
样式=“停止-颜色:红绿蓝(255,0,0);停止-透明度:1“ />
</匀速渐变>
</定义>
<椭圆 cx=“100“ cy=“70“ rx=“85“ ry=“55“ 填充=“本地地址(#变化)“ />
<文本 填充=“#ffffff“ 字体大小=“45“ 字体系列=“雅黑"
x=“50“ y=“86“>矢量图</文本>
抱歉，您的浏览器不支持嵌入式 矢量图。
</矢量图>
</主体>
</网页>

---

---