當在SVG(Scalable Vector Graphics)中設計線時,您可以使用<line>元素。這個元素允許您在SVG畫布上繪製直線,而您可以通過指定起點和終點的座標,以及其他屬性,來定義這條線。

以下是一些在SVG中設計線的例子:

簡單的水平線

xml
<svg width="100" height="50" xmlns="http://www.w3.org/2000/svg"> <line x1="10" y1="25" x2="90" y2="25" stroke="black" stroke-width="2"/> </svg>

這個例子在一個100x50的SVG畫布上繪製了一條水平線,起點座標是(10, 25),終點座標是(90, 25),線的顏色為黑色,寬度為2。

垂直線

xml
<svg width="50" height="100" xmlns="http://www.w3.org/2000/svg"> <line x1="25" y1="10" x2="25" y2="90" stroke="red" stroke-width="3"/> </svg>

這個例子在一個50x100的SVG畫布上繪製了一條垂直線,起點座標是(25, 10),終點座標是(25, 90),線的顏色為紅色,寬度為3。

對角線

xml
<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"> <line x1="10" y1="10" x2="90" y2="90" stroke="blue" stroke-width="1"/> </svg>

這個例子在一個100x100的SVG畫布上繪製了一條對角線,起點座標是(10, 10),終點座標是(90, 90),線的顏色為藍色,寬度為1。

這只是一些簡單的例子,您可以通過調整座標、顏色、寬度等屬性來創建不同的線條效果。希望這些例子能幫助您開始在SVG中設計線。