The purpose
of <line> element in SVG is for creation line or lines. In a simple line
x1 attribute describes and defines the start of the line on x-axis. The y1
attribute whereas describes the start of the line on Y-axis. The attributes x2
and y2 describes the end of lines on both x-axis and y-axis respectively.
Example:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8"/>
<title>SVG Line</title>
<style>
line{
stroke-width:3;
stroke:green;
}
</style>
</head>
<body>
<h2>Sample SVG Line </h2>
<svg height="700" width="600">
<line x1="0" y1="0" x2="200" y2="300" />
<line x1="80" y1="10" x2="300" y2="400" />
</svg>
</body>
</html> 
No comments:
Post a Comment