svg可用的元素标签

<svg>:根元素,用于定义 SVG 图形。

<g>:组元素,用于将多个 SVG 元素组合在一起,便于统一管理。

<defs>:定义元素,用于定义在 SVG 图像中重复使用的元素,如渐变、模式、裁剪路径等。

<desc>:描述元素,用于为 SVG 元素提供文本描述,通常用于提高可访问性。

<title>:标题元素,为 SVG 提供标题,同样有助于提高可访问性。

<symbol>:符号元素,用于定义可重用的图形元素,通常与 <use> 元素结合使用。

<use>:使用元素,用于引用在其他地方(如 <defs> 或 <symbol>)定义的图形元素。

图形元素

<rect>:矩形元素,用于绘制矩形。

<circle>:圆形元素,用于绘制圆。

<ellipse>:椭圆元素,用于绘制椭圆。

<line>:线条元素,用于绘制直线。

<polyline>:多线元素,用于绘制多条相连的直线。

<polygon>:多边形元素,用于绘制闭合的多边形。

<path>:路径元素,用于绘制复杂的形状。

文本元素

<text>:文本元素,用于在 SVG 中添加文本。

<tspan>:文本跨度元素,用于在 <text> 元素内分组和样式化文本片段。

<textPath>:文本路径元素,用于将文本沿着路径排列。

图像和多媒体元素

<image>:图像元素,用于在 SVG 中嵌入图像。

<audio>:音频元素,用于在 SVG 中嵌入音频内容(尽管在 SVG 中使用较少)。

<video>:视频元素,用于在 SVG 中嵌入视频内容(同样在 SVG 中使用较少)。

滤镜和遮罩元素

<filter>:滤镜元素,用于定义可应用于 SVG 元素的滤镜效果。

<feBlend><feColorMatrix><feComponentTransfer><feComposite><feConvolveMatrix><feDiffuseLighting><feDisplacementMap><feDropShadow><feFlood><feFuncA><feFuncB><feFuncG><feFuncR><feGaussianBlur><feImage><feMerge><feMergeNode><feMorphology><feOffset><feSpecularLighting><feTile><feTurbulence>:这些都是滤镜效果子元素,用于创建各种复杂的图形效果。

<mask>:遮罩元素,用于定义可应用于 SVG 元素的遮罩。

裁剪和视口元素

<clipPath>:裁剪路径元素,用于定义可应用于 SVG 元素的裁剪区域。

<view>(已废弃):视口元素,曾用于定义 SVG 视口,但现已被更现代的技术所取代。

动画元素(SVG 1.2 及更高版本):

<animate>:动画元素,用于为 SVG 元素添加基本动画效果。

<animateTransform>:变换动画元素,用于为 SVG 元素添加变换动画(如旋转、平移、缩放等)。

<set>:设置元素,用于在特定时间点设置 SVG 元素的属性值。

<animateMotion>:运动动画元素,用于使 SVG 元素沿着路径运动。

交互性元素(通过脚本和事件处理实现):

虽然 SVG 本身没有专门的交互性元素,但可以通过在元素上添加事件处理器(如 onclick、onmouseover 等)和使用脚本(通常是通过 <script> 元素嵌入的 JavaScript)来实现交互性。

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容