个性化阅读
专注于IT技术分析

SVG symbol元素用法详解

SVG <symbol>元素定义可重复使用的符号。除非被<use>元素引用, 否则嵌套在<symbol>内的形状不会显示在屏幕上。

例子

<!DOCTYPE html>
<html>
   <body>

<svg width="450" height="450">
    <symbol id="shape1">
        <circle cx="40" cy="40" r="40" />
    </symbol>

    <use xlink:href="#shape1" x="50" y="30" />
</svg>

</body>
</html>

立即测试

解释

  • <symbol>的id属性定义了符号的唯一名称。
  • id属性是<symbol>元素所必需的, 因此以后可以由<use>元素引用。
赞(0) 打赏
未经允许不得转载:srcmini » SVG symbol元素用法详解
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

觉得文章有用就打赏一下文章作者

微信扫一扫打赏