How to make these arrows? It looks like a dotted line from the border, but I don’t know how to apply it here :( Or is it just to cut and paste png?

enter image description here

    1 answer 1

    Yes, that's right, for the block, you use the border property, you need to null the necessary sides and turn the transform property to the desired angle.

    Something like this:

    .arrow { width: 100px; height: 100px; margin: 50px; border: 5px dotted #b1d454; border-top: none; border-right: none; -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -o-transform: rotate(-135deg); -ms-transform: rotate(-135deg); transform: rotate(-135deg); } 
     <div class="arrow"></div>

    But still for better cross-browser compatibility (all IE8) it would be better to cut the png, I think.

    • Thanks for the help) - Alexander