<div class="time_line_box">

            <div class="time_line" style="width:100%;">

                <ol>

                    <li>

                        <a class="order_item" style="left:10%;">预约</a>

                    </li>

                    <li>

                        <a class="order_item selected" style="left:25%;">行家确认</a>

                    </li>

                    <li>

                        <a class="order_item" style="left:45%;">付款</a>

                    </li>

                    <li>

                        <a class="order_item" style="left:65%;">见面</a>

                    </li>

                    <li>

                        <a class="order_item" style="left:85%;">评价</a>

                    </li>

                </ol>

                <span class="filling_line" style="transform: scaleX(0.28);"></span>

            </div>

        </div>

        <div class="time_tip">

                付款剩余时间：：

        </div>

.time_line_box{

        position: relative;

        height: 60px;

        overflow: hidden;

    }

    .time_line{

        position: absolute;

    z-index: ;

    left: ;

    top: 49px;

    height: 2px;

    background: #dfdfdf;

    -webkit-transition: -webkit-transform .4s;

    -moz-transition: -moz-transform .4s;

    transition: transform .4s;

    }

    .order_item{

        position: absolute;

    bottom: ;

    z-index: ;

    text-align: center;

    font-size: 13px;

    padding-bottom: 15px;

    color: #825FFB;

    }

    .order_item:after{

        content: '';

    position: absolute;

    left: %;

    right: auto;

    transform: translateX(-%);

    bottom: -5px;

    height: 10px;

    width: 10px;

    border-radius: %;

    border: 2px solid #dfdfdf;

    background-color: #f8f8f8;

    }

    .selected:after{

        background-color: #845FFD;

    border-color: #845FFD;

    }

    .filling_line{

        position: absolute;

    z-index: ;

    left: ;

    top: ;

    height: %;

    width: %;

    background-color: #845FFD;

    transform-origin: left center;

    transition-property: transform;

    transition-duration: .3s;

    transition-timing-function: initial;

    transition-delay: initial;

    }

    .time_tip{

        width: %;

        height: 100px;

        line-height: 70px;

        text-align: center;

        color: #151BFD;

        border-bottom: 1px solid #ddd;

    }