HTML5 内联 SVG

SVG 指可伸缩矢量图形，用于定义网络的基于矢量的图形，SVG图像在放大或改变尺寸的情况下其图形质量不会有损失。

清浅更新时间：2019-01-17 10:51:49

具体内容
相关视频
相关知识
最新评论

HTML5 内联 SVG

HTML5 支持内联 SVG

SVG的含义

SVG 指可伸缩矢量图形 (Scalable Vector Graphics)
SVG 用于定义网络的基于矢量的图形
SVG 使用 XML 格式定义图形
SVG 图像在放大或改变尺寸的情况下其图形质量不会有损失
SVG 是万维网联盟的标准

SVG 的优势

SVG 图像可通过文本编辑器来创建和修改
SVG 图像可被搜索、索引、脚本化或压缩
SVG 是可伸缩的
SVG 图像可在任何的分辨率下被高质量地打印
SVG 可在图像质量不下降的情况下被放大

浏览器支持

Internet Explorer 9、Firefox、Opera、Chrome 以及 Safari 支持内联 SVG。

在HTML页面嵌入SVG

在 HTML5 中，您能够将 SVG 元素直接嵌入 HTML 页面中：

实例

<!DOCTYPE html>
<html>
<body>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190">
   <polygon points="100,10 40,180 190,60 10,60 160,180"
   style="fill:pink;stroke:#444;stroke-width:3;fill-rule:evenodd;" />
</svg>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

效果图：

推荐手册

HTML5 内联 SVG

实例