JSFiddle - React, Tailwind, and code Playground

by ken tsai

HTML

<p class="line_t draw-line-1 draw-line-2"><span>
  我好帥! 我好帥!
</span></p>

CSS

p.line_t {
    border-bottom: 0;
    margin-top: 15px;
}
/*以變換不同的寬與時間差讓三條線依序畫出*/
.draw-line-1 span{
    /* background-color: red; */
}
.draw-line-1:before {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    -webkit-transition: width 1.5s .5s;
    transition: width 1.5s .5s;
    border-top: 1px solid #FF5008;
    /*調間距*/
   
}