March 2017
Beginner to intermediate
868 pages
18h 52m
English
SVG shapes have an attribute known as stroke. The attribute stroke specifies the color of a line that outlines an SVG shape. We saw the use of stroke with a line, but it can be used with most of the SVG elements.
Whenever we specify stroke, we usually also specify a stroke width using the stroke-width attribute. This informs SVG about the thickness (in pixels) of the outline that will be rendered.
To demonstrate
stroke and stroke-width attributes, the following example recreates the path from the path example, and sets a stroke to be 10 pixels thick, using red as its color. Additionally, we set the fill of the path to blue. We set all the attributes using the style property of stroke:
<path d="M 10 10 L 210 10 L 110 120 ...
Read now
Unlock full access