--- title: defs slug: Web/SVG/Element/defs tags: - SVG - SVG容器 - 元素 translation_of: Web/SVG/Element/defs ---
SVG 允许我们定义以后需要重复使用的图形元素。 建议把所有需要再次使用的引用元素定义在defs
元素里面。这样做可以增加SVG内容的易读性和可访问性。 在defs
元素中定义的图形元素不会直接呈现。 你可以在你的视口的任意地方利用 {{ SVGElement("use") }}元素呈现这些元素。
{{svginfo}}
<svg width="80px" height="30px" viewBox="0 0 80 30" xmlns="http://www.w3.org/2000/svg"> <defs> <linearGradient id="Gradient01"> <stop offset="20%" stop-color="#39F" /> <stop offset="90%" stop-color="#F3F" /> </linearGradient> </defs> <rect x="10" y="10" width="60" height="10" fill="url(#Gradient01)" /> </svg>
没有专有属性
这个元素实现了SVGDefsElement
接口。