SVG <defs>元素用于嵌入可在SVG映像内重用的定义。
使用SVG <defs>元素, 你可以将SVG形状组合在一起, 并将其作为单个形状重复使用。
当你通过<use>元素引用<defs>元素中定义的形状时, 将显示该形状。
例子
<!DOCTYPE html>
<html>
<body>
<svg>
<defs>
<g id="shape">
<rect x="40" y="40" width="40" height="40" />
<circle cx="40" cy="40" r="40" />
</g>
</defs>
<use xlink:href="#shape" x="40" y="40" />
<use xlink:href="#shape" x="160" y="40" />
</svg>
</body>
</html>
立即测试
解释
- <g>的id属性定义一个唯一的名称。
- <use>元素通过其xlink:href属性引用<g>元素。
- #符号定义属性值。
- <use>元素用于通过其x和y属性指定在何处显示重复使用的形状。
评论前必须登录!
注册