我试图<hr>用SVG 复制一个.现在,使用SVG制作一条直线可以完美地工作,但是第二个我用渐变划线它将不再以直线显示.
以下代码有效,但请注意,y1和y2必须相隔1个单位.例如,如果我将y1和y2设置为210,则该行将消失.
<defs>
<linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" style="stop-color:rgba(0,0,0,0);stop-opacity:0" />
<stop offset="50%" style="stop-color:rgba(0,0,0,0.75);stop-opacity:1" />
<stop offset="100%" style="stop-color:rgba(0,0,0,0);stop-opacity:0" />
</linearGradient>
</defs>
<line x1="40" y1="210" x2="460" y2="211" stroke="url(#grad1)" stroke-width="1" />
我可能只是错过了线性渐变的一些明显功能,而且线条看起来还不错,但我更倾向于让它笔直.谢谢.