当前位置: 首页 > news >正文

(vue)el-progress左侧添加标签/名称

(vue)el-progress左侧添加标签/名称


在这里插入图片描述


解决思路:使用 CSS 绝对定位

html

<div class="progress-main" v-for="(e, i) of progressList" :key="i"><span class="progress-label">{{ e.label }}</span><el-progress :percentage="e.value" :stroke-width="15" striped />
</div>

css

.progress-main {position: relative;padding-left: 60px; /* 为标签留出空间 */margin: 20px 0;.progress-label {position: absolute;left: 0;top: 50%;transform: translateY(-50%);min-width: 60px;}
}
http://www.xdnf.cn/news/1367749.html

相关文章:

  • 机器视觉学习-day02-灰度化实验
  • 【云计算】云原生(Cloud Native)
  • Spark云原生流处理实战与风控应用
  • 【云原生】CentOS安装Kubernetes+Jenkins
  • 【语法】【C+V】本身常用图表类型用法快查【CSDN不支持,VSCODE可用】
  • 云计算学习笔记——Linux硬盘、硬盘划分、交换空间、自动挂载篇
  • CentOS 7服务器初始化全攻略:从基础配置到安全加固
  • Redis ZSET 深度剖析:从命令、原理到实战
  • 几种方式实现文件自动上传到服务器共享文件夹
  • NVIDIA GPU 中的 L2 Cache
  • 【Linux】Socket编程——TCP版
  • 深入OpenHarmony后台任务“黑匣子”:BackgroundTaskMgr框架全栈解析与实战避坑指南
  • Thingsboard 租户管理员权限,增加租户普通用户权限
  • 三、显示3D文字
  • PLC通讯中遇到的实际场景
  • Mamba-HoME:面向3D医学影像分割的层次化专家混合新框架
  • 自然处理语言NLP: 基于双分支 LSTM 的酒店评论情感分析模型构建与实现
  • 透视光合组织大会:算力生态重构金融AI落地新实践
  • C语言 指针
  • 【设计模式】 面向对象基础
  • 打破技术壁垒的先进制造框架的智慧工业开源了
  • 如何利用ArcGIS探究环境与生态因子对水体、土壤、大气污染物的影响?
  • Mac安装mitmproxy及操作对监控的请求
  • Android Glide常见问题解决方案:从图片加载到内存优化
  • 使用 Docker、Jenkins、Harbor 和 GitLab 构建 CI/CD 流水线
  • Linux文件系统深入解析:从原理到实践
  • 通义灵码插件——AI 重构表单开发!半小时搭建可视化拖拽系统,效率碾压传统模式
  • 面试:Spring
  • MySQL 面试题系列(三)
  • week5-[循环结构]听歌