SVG <line>元素是一個(gè)SVG基本形狀,用來創(chuàng)建一條連接兩個(gè)點(diǎn)的線。 <line>元素用于在SVG圖像內(nèi)部繪制線條??梢岳L制水平直線,垂直豎線直線、斜角直線等
以下是一些簡單的常用SVG <line>畫直線的示例:
<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> <line x1="10" y1="10" x2="100" y2="100" style="stroke:#006600;"></line> <line x1="20" y1="10" x2="100" y2="50" style="stroke:#006600;"></line> <line x1="30" y1="10" x2="110" y2="10" style="stroke:#006600;"></line> </svg>測試看看 ?/?
以上代碼運(yùn)行后直線效果如下:
直線起始點(diǎn)由x1和y1屬性設(shè)置的點(diǎn)處。
直線終點(diǎn)由x2和y2屬性設(shè)置的點(diǎn)處。
該style屬性設(shè)置筆劃(線條)的顏色和粗細(xì)。