The use of borders in UI/UX design can be invaluable in allowing elements on the page to serve the user well. It provides a sense of perspective on the page and how the user interacts with the element on the page.
Maybe you ever use a dashed-line to create a flow section like a "how its works" process or just to pleasing the style and look.
Customizing the spacing between the dashed lines is pretty easy to achieve from the design editor. Just change the array number to find the preferred dashed line looks.
I just realized in the CSS syntax that there are no CSS properties to control the spacing and the length of the lines.
In basic CSS syntax, you usually write
border: 1px dashed #000000; or directly using border-style property like
border-style: dashed; to create border line on an element.
If you take a look on this Stackoverflow post, there is an explanation of some methods that can be use to create dashed line.
My main focused on his pros and cons is the browser combability. I see that the SVG methods is the best one. All browser are supported with this SVG properties.
You can use
polygon to create the border line then adjust the
stroke-dasharray to customize the spacing and the range of the border stroke.
The easiest alternative is you can use this generator below to create and adjust those properties.
Take a look and play with it!