SVG Basic
SVG HOME SVG Intro SVG Example SVG in HTMLSVG Shapes
SVG Rectangle SVG Circle SVG Ellipse SVG Line SVG Polygon SVG Polyline SVG Path SVG Text SVG StrokingSVG Filters
SVG Filters Intro SVG Blur Effects SVG Drop ShadowsSVG Gradients
SVG Linear SVG RadialSVG Examples
SVG ExamplesSVG Reference
SVG ReferenceSVG <line>
SVG Line - <line>
The <line> element is used to create a line:
Here is the SVG code:
Example
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<line x1="0" y1="0" x2="200" y2="200"
style="stroke:rgb(255,0,0);stroke-width:2"/>
</svg>
<line x1="0" y1="0" x2="200" y2="200"
style="stroke:rgb(255,0,0);stroke-width:2"/>
</svg>
Try it yourself »
For Opera users: View the SVG file (right-click on the SVG graphic to view the source).
Code explanation:
- The x1 attribute defines the start of the line on the x-axis
- The y1 attribute defines the start of the line on the y-axis
- The x2 attribute defines the end of the line on the x-axis
- The y2 attribute defines the end of the line on the y-axis
Your suggestion:
Close [X]
Thank You For Helping Us!
Your message has been sent to W3Schools.
Close [X]
