zoukankan      html  css  js  c++  java
  • css3实现渐变进度条

    渐变进度条,如图:

    实现:

    dom:

    <div className={s.progress}>
        <div className={s.bar} style={{ '73%'}}/>
    </div>

    css:外层div设置背景色有透明度,内层div设置渐变,有宽度,有圆角

    .progress{
        background-color: rgba(15,182,217,0.3);
        border-radius:px-vh(10);
        .bar{
            background:linear-gradient(90deg,rgba(15,182,217,1),rgba(1,255,255,1));
            border-radius:px-vh(10);
        }
    }
  • 相关阅读:
    C
    B
    A
    F
    C
    H
    Fang Fang hdu 5455
    Fire Net hdu1045(DFS)
    Sudoku HDU 5547(DFS)
    UVA 10200 Prime Time (打表)
  • 原文地址:https://www.cnblogs.com/wuhairui/p/13682020.html
Copyright © 2011-2022 走看看