SVG 线性渐变填充上的元素停止缺少必需的属性偏移

Question

W3 验证抛出以下错误：-

Element stop is missing required attribute offset

关于此代码：-

<!--  Defining Angle Gradient Colors  -->
<svg width="0" height="0">
<defs>
<!-- Colours red #ca3b37 gold #f0a635 blue #4fc4f6 green #0FBD46-->
<linearGradient id="cl1" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="1" y2="1">
<stop stop-color="#ca3b37"/>
<stop offset="100%" stop-color="#ca3b37"/>
</linearGradient>
<linearGradient id="cl2" gradientUnits="objectBoundingBox" x1="0" y1="0" x2="0" y2="1">
<stop stop-color="#ca3b37"/>
<stop offset="100%" stop-color="#f0a635"/>
</linearGradient>
<linearGradient id="cl3" gradientUnits="objectBoundingBox" x1="1" y1="0" x2="0" y2="1">
<stop stop-color="#f0a635"/>
<stop offset="100%" stop-color="#4fc4f6"/>
</linearGradient>
<linearGradient id="cl4" gradientUnits="objectBoundingBox" x1="1" y1="1" x2="0" y2="0">
<stop stop-color="#4fc4f6"/>
<stop offset="100%" stop-color="#4fc4f6"/>
</linearGradient>
<linearGradient id="cl5" gradientUnits="objectBoundingBox" x1="0" y1="1" x2="0" y2="0">
<stop stop-color="#4fc4f6"/>
<stop offset="100%" stop-color="#0FBD46"/>
</linearGradient>
<linearGradient id="cl6" gradientUnits="objectBoundingBox" x1="0" y1="1" x2="1" y2="0">
<stop stop-color="#0FBD46"/>
<stop offset="100%" stop-color="#0FBD46"/>
</linearGradient>
</defs>
</svg>

谁能告诉我缺少的属性是什么/如何应用它。

谢谢

格伦尼男孩

Answer 1

在您的示例中，有些停止元素具有偏移属性，有些则没有。您需要为所有没有的添加偏移属性。

<stop stop-color="#ca3b37"/>
<stop offset="100%" stop-color="#ca3b37"/>

变成

<stop offset="<some value you need to decide on>" stop-color="#ca3b37"/>
<stop offset="100%" stop-color="#ca3b37"/>

您将 替换为一个值，也许是 0。