百分比组件 - elementui改动

Element UI 是一款基于 Vue 的桌面端组件库。如果您想要修改 Element UI 中的百分比组件，您可以通过以下步骤进行：

1. 找到 Element UI 的源代码或者样式文件。
2. 复制相关的样式代码到您的项目样式文件中。
3. 根据您的需求修改样式。
4. 在您的 Vue 组件中使用修改后的样式。

以下是一个简单的示例，假设您想要修改 Element UI 的进度条（Progress）组件的百分比样式：

1. 在 Element UI 的样式文件中找到百分比样式的选择器。

/* 假设这是 Element UI 原生的百分比样式 */
.el-progress__text {
  display: block;
  font-size: 14px;
  color: #fff;
}

2. 将样式复制到您的项目样式文件中。

/* 将 Element UI 的百分比样式复制到您的样式文件 */
.my-progress__text {
  display: block;
  font-size: 14px;
  color: #fff;
}

3. 根据需求修改样式。

/* 修改样式，比如改变颜色 */
.my-progress__text {
  color: #000; /* 将百分比颜色改为黑色 */
}

4. 在 Vue 组件中使用修改后的类名。

<template>
  <el-progress :percentage="50" class="my-progress">
    <span class="my-progress__text">30%</span>
  </el-progress>
</template>
 
<style>
/* 引入修改后的样式 */
.my-progress__text {
  color: #000;
}
</style>

请注意，您需要确保您的自定义样式选择器比 Element UI 原生样式的优先级更高，或者使用 !important 来确保样式被应用。如果 Element UI 使用了 SASS 或 LESS，您可以通过那些预处理器的继承和覆盖特性来更轻松地修改样式。