CSS可视化指针刻度仪表盘

CSS可视化指针刻度仪表盘
价格 免费
插件介绍
一款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>
  • 最新评论
  • 总共 0 条评论