css俩段线段上坡；父元素设置了display:flex之后子元素超出父元素宽度被压缩现象解决

    .line {
      width: 200px;
      background: #1677ee;
      position: relative;
      margin-bottom: 34px;
      transform-origin: top left;
      height: 4px;
      border-radius: 2px;
      flex-shrink: 0;
      
    }

    .endStaion {
      width: 200px;
      background: #1677ee;
      transform-origin: top left;
      height: 4px;
      border-radius: 2px;
      flex-shrink: 0;
      transform: rotate(-30deg);
      position: relative;
      top: -16px;
      left: -3px
    }

 父元素设置了display:flex之后子元素超出父元素宽度被压缩现象解决

只需要给子元素设置

flex-shrink: 0;

意思就是不要弹性 按照实际的宽度进行展示