SVG线元素

时间:2020-01-09 10:44:24  来源:igfitidea点击:

SVG的<line>元素用于在SVG图像内绘制线条。

SVG线示例

以下是一些简单的SVG系列示例:

<svg xmlns="http://www.w3.org/2000/svg"
    xmlns:xlink="http://www.w3.org/1999/xlink">

    <line x1="0"  y1="10" x2="0"   y2="100" style="stroke:#006600;"/>
        <line x1="10" y1="10" x2="100" y2="100" style="stroke:#006600;"/>
        <line x1="20" y1="10" x2="100" y2="50"  style="stroke:#006600;"/>
        <line x1="30" y1="10" x2="110" y2="10"  style="stroke:#006600;"/>
</svg>

这是渲染后生成的SVG图像:

线"始于"由" x1"和" y1"属性设置的点。

线"结束"在由" x2"和" y2"属性设置的点。

" style"属性设置笔触(线条)的颜色和粗细。样式属性在不同的文本中有更详细的介绍。