漏刻有时数据大屏CSS样式表成长教程(3)：使用样式表做圆环指示图标

.dot1 {
    display: inline-block;
    width: 10px;
    height: 10px;
    border: 2px solid #FF4145;
    border-radius: 50%;
    background: transparent;
    margin-left: 10px;
    margin-right: 5px;
}
.dot2 {
    display: inline-block;
    width: 10px;
    height: 10px;
    border: 2px solid #FF8D00;
    border-radius: 50%;
    background: transparent;
    margin-left: 10px;
    margin-right: 5px;
}
.dot3 {
    display: inline-block;
    width: 10px;
    height: 10px;
    border: 2px solid #FDFF00;
    border-radius: 50%;
    background: transparent;
    margin-left: 10px;
    margin-right: 5px;
}

border-radius: 50%;
    border: 2px solid #FF4145;
    background: transparent;