先上效果图
由于业务需要,需要做一排圆点,实现方法有很多,在此记录一下另一种实现方式。
最终效果:
效果前提
由于仅仅做小程序,而且使用了weUI样式,其中有一个徽章badge,突然奇想用徽章badge做一排圆点,在badge wxss中修改你需要的背景色,字体颜色同背景色即可。
<mp-badge content="8" style="margin-left: 10px;"/>
<mp-badge content="8" style="margin-left: 10px;"/>
<mp-badge content="8" style="margin-left: 10px;"/>
<mp-badge content="8" style="margin-left: 10px;"/>
<mp-badge content="8" style="margin-left: 10px;"/>
<mp-badge content="8" style="margin-left: 10px;"/>
<mp-badge content="8" style="margin-left: 10px;"/>
<mp-badge content="8" style="margin-left: 10px;"/>
<mp-badge content="8" style="margin-left: 10px;"/>
<mp-badge content="8" style="margin-left: 10px;"/>
<mp-badge content="8" style="margin-left: 10px;"/>
<mp-badge content="8" style="margin-left: 10px;"/>
在此 我就不放入其他样式了,可根据项目自行修改。如有更好的办法,欢迎交流!