From the course: Learning SVG
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
Dashes
- [Narrator] Some designs call for solid strokes, other designs call for dashes instead. And using SVG strokes we can create any dash pattern the design calls for. To turn our strokes into dashes, we use the stroke-dasharray argument or CSS property. And the stroke-dasharray is a literal array of lengths, where the first length is the first dash, and the second length is the space between the dashes, and the third length is the third dash, and so on and so on. This is a repeating pattern and you can add as many lengths as you want. So you can create a very simple repeating pattern of two values, that define just the length of the dash and then the length of the space, or you can add very complex pattern, with lots of different values. The dasharray pattern will repeat itself for the full length of the stroke, however long the stroke is. So here you're safe to experiment until you get exactly what you're looking for. In the exercise files for this movie, you will find the same polyline…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.