el-slider节点样式修改

要修改 `el-slider` 组件的样式，可以使用以下两种方法：

1. 使用 scoped 样式

在 `el-slider` 组件所在的组件中添加 `scoped` 属性，然后在 `<style>` 标签中编写样式即可。例如：

<template>
  <el-slider v-model="value"></el-slider>
</template>

<script>
  export default {
    data() {
      return {
        value: 50
      };
    }
  };
</script>

<style scoped>
  .el-slider__runway {
    height: 10px;
    background-color: #ccc;
  }
  .el-slider__bar {
    background-color: #409EFF;
  }
  .el-slider__button-wrapper {
    margin-top: -5px;
  }
</style>

在上面的例子中，我们使用了 `.el-slider__runway`、`.el-slider__bar` 和 `.el-slider__button-wrapper` 这三个类来修改 `el-slider` 的样式。

2. 使用全局样式

使用全局样式可以修改所有 `el-slider` 组件的样式。可以在 `App.vue` 或者其他全局组件中添加样式。例如：

<template>
  <el-slider v-model="value"></el-slider>
</template>

<script>
  export default {
    data() {
      return {
        value: 50
      };
    }
  };
</script>

然后在 `<style>` 标签中编写样式：

<style>
  .el-slider__runway {
    height: 10px;
    background-color: #ccc;
  }
  .el-slider__bar {
    background-color: #409EFF;
  }
  .el-slider__button-wrapper {
    margin-top: -5px;
  }
</style>

在上面的例子中，我们使用了 `.el-slider__runway`、`.el-slider__bar` 和 `.el-slider__button-wrapper` 这三个类来修改 `el-slider` 的样式。这种方式会影响所有 `el-slider` 组件的样式，所以需要谨慎使用。