The quick brown fox jumps over a lazy dog.Two quick brown foxes jumps over two lazy dogs.Ha.
border Width
px
border Radius
px
border Color
#
patch Lenth
px
patch Margin
px
patch Shape
round
square
butt
copy
background: url("data:image/svg+xml,%3csvg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'%3e%3crect x='10' y='10' width='100%' height='100%' rx='-10' ry='-10' fill='none' stroke='%23000000' stroke-width='20' stroke-dasharray='50%2c 40' stroke-linecap='round'/%3e%3c/svg%3e") left top / calc(100% - 20px) calc(100% - 20px) no-repeat, url("data:image/svg+xml,%3csvg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'%3e%3crect x='10' y='-10' width='100%' height='100%' rx='-10' ry='-10' fill='none' stroke='%23000000' stroke-width='20' stroke-dasharray='50%2c 40' stroke-linecap='round'/%3e%3c/svg%3e") left bottom / calc(100% - 20px) calc(100% - 20px) no-repeat, url("data:image/svg+xml,%3csvg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'%3e%3crect x='-10' y='10' width='100%' height='100%' rx='-10' ry='-10' fill='none' stroke='%23000000' stroke-width='20' stroke-dasharray='50%2c 40' stroke-linecap='round'/%3e%3c/svg%3e") right top / calc(100% - 20px) calc(100% - 20px) no-repeat, url("data:image/svg+xml,%3csvg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'%3e%3crect x='-10' y='-10' width='100%' height='100%' rx='-10' ry='-10' fill='none' stroke='%23000000' stroke-width='20' stroke-dasharray='50%2c 40' stroke-linecap='round'/%3e%3c/svg%3e") right bottom / calc(100% - 20px) calc(100% - 20px) no-repeat