实现下划线动画

css

点击查看代码

 span {
        line-height: 2;
        background: -webkit-linear-gradient(left, #12c2e9, #c471ed, #f64f59) no-repeat right bottom;
        background-size: 0% 2px;
        transition: background-size 500ms linear;
    }

    span:hover {
        background-position-x: left;
        background-size: 100% 2px;
    }