svg标签简单实例

最新推荐文章于 2024-07-31 16:50:09 发布

窩時妳嘚埃菲尔

最新推荐文章于 2024-07-31 16:50:09 发布

阅读量254

点赞数

分类专栏： html 文章标签： html

本文链接：https://blog.csdn.net/qq_43503385/article/details/105598998

版权

SVG是一种使用XML描述二维图形的网络标准，它支持放大不失真且与DOM和XSL等W3C标准集成。这篇博客介绍了SVG的基本概念，并展示了从圆形、矩形到星星和折线等多种图形实例。

摘要由CSDN通过智能技术生成

什么是SVG（简介）？

SVG 是使用 XML 来描述二维图形和绘图程序的语言。

SVG 指可伸缩矢量图形 (Scalable Vector Graphics)
SVG 用来定义用于网络的基于矢量的图形
SVG 使用 XML 格式定义图形
SVG 图像在放大或改变尺寸的情况下其图形质量不会有所损失
SVG 是万维网联盟的标准
SVG 与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体

1.简单的圆形

<!DOCTYPE html>
<html>
<body>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
   <circle cx="100" cy="50" r="40" stroke="black" stroke-width="2" fill="red" />
</svg> 
 
</body>
</html>

2.矩形

<!DOCTYPE html>
<html>
<body>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
  <rect width="300" height="100" style="fill:rgb(0,0,255);stroke-width:1;stroke:rgb(0,0,0)" />
</svg>