一款CSS可视化指针刻度仪表盘,demo里的js代码只是为了辅助。
<div class="gauge"> <div class="ticks"> <div class="tithe" style="--gauge-tithe-tick:1;"></div> <div class="tithe" style="--gauge-tithe-tick:2;"></div> <div class="tithe" style="--gauge-tithe-tick:3;"></div> <div class="tithe" style="--gauge-tithe-tick:4;"></div> <div class="tithe" style="--gauge-tithe-tick:6;"></div> <div class="tithe" style="--gauge-tithe-tick:7;"></div> <div class="tithe" style="--gauge-tithe-tick:8;"></div> <div class="tithe" style="--gauge-tithe-tick:9;"></div> <div class="min"></div> <div class="mid"></div> <div class="max"></div> </div> <div class="tick-circle"></div> <div class="needle"> <div class="needle-head"></div> </div> <div class="labels"> <div class="value-label"></div> </div> </div>
CSS可视化指针刻度仪表盘
正在加载文件目录...
- 热度 13
宾果下载了 此素材
归尘下载了 此素材
万古青天灯寂灭下载了 此素材
周下载了 此素材
心飞扬下载了 此素材
liufang2008054下载了 此素材
风向决定发型d下载了 此素材
三好市民侯某下载了 此素材
墙上的向日葵下载了 此素材
嚯嚯嚯下载了 此素材