您的位置：首页 > Web前端 > HTML

SVG 嵌入 HTML 页面

2015-12-02 16:49 155 查看

我们都知道位图有一个缺点，就是放大缩小会导致图片失真，为了解决这个问题，矢量图就应运而生，其中SVG（可缩放矢量图形）就是一种w3c标准的矢量图。SVG的应用非常广泛，

与其他图像格式相比（比如 JPEG 和 GIF），使用 SVG 的优势在于：

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

那么我们如何使用SVG呢？在 HTML5 中，可以将 SVG 元素直接嵌入 HTML 页面中，使得SVG的使用变得非常简单。下面是我们的一个使用SVG的小例子：

<!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:red;stroke:blue;stroke-width:3;fill-rule:evenodd;" />
</svg>

</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航