CSS实现弯曲尾巴箭头形状代码

小泽 2020-08-03 12:11 1条评论

curvedarrow

image.png

    #curvedarrow {
      position: relative;
      width: 0;
      height: 0;
      border-top: 9px solid transparent;
      border-right: 9px solid red;
      transform: rotate(10deg);
    }
    #curvedarrow:after {
      content: "";
      position: absolute;
      border: 0 solid transparent;
      border-top: 3px solid red;
      border-radius: 20px 0 0 0;
      top: -12px;
      left: -9px;
      width: 12px;
      height: 12px;
      transform: rotate(45deg);
    }
本文标签: css, 弯曲尾巴, 箭头形状
0.0

说点什么吧
  • 全部评论(0