css实现小圆点的代码

洪七公

要求效果：

具体代码：

html

1. <div v-if="scope.data.row.status === 1">
   
2.         <div class="status-point" style=" background-color:#67C23A" />
   
3.         已通过
   
4.       </div>
   
5.       <div v-else-if="scope.data.row.status === 0">
   
6.         <div class="status-point" style=" background-color:#E6A23C" />
   
7.         未被审批</div>
   
8.       <div v-else-if="scope.data.row.status === 2">
   
9.         <div class="status-point" style=" background-color:#00000040" />
   
10.         未通过</div>

复制代码

css

1. <style scoped>
   
2. 
   
3. .status-point {
   
4.   display: inline-block;
   
5.   width: 6px;
   
6.   height: 6px;
   
7.   border-radius: 50%;
   
8. }
   
9. </style>

复制代码

后面想到用，也可以用i标签，这个实现方法的好处是圆点饱满边缘整齐