stroke-dashoffset

The stroke-dashoffset attribute accepts positive or negative length or percentage values and specifies the distance into the dash pattern to start rendering the dash. This offset can be seen in the following code example:

<svg width="400" height="300" viewBox="0 0 400 300"  
 xmlns="http://www.w3.org/2000/svg">
 <rect x="50" y="20" width="300" height="50" fill="none"
  stroke="#000000" stroke-width="4" stroke-dasharray="10 10"></rect>
 <rect x="50" y="80" width="300" height="50" fill="none"
  stroke="#000000" stroke-width="4" stroke-dasharray="10 10" stroke- 
  dashoffset="25"></rect>
 <rect x="50" y="140" width="300" height="50" fill="none"
  stroke="#000000" stroke-width="4" stroke-dasharray="10 10" stroke-
  dashoffset="-25"></rect>
</svg>

The effect of this attribute can be seen in the following screenshot: