vue3中修改element样式

在Vue3中，可以使用以下方法修改Element UI组件的样式：

1. 使用scoped样式

在Vue3中，可以使用`<style scoped>`来将样式限制在组件内部。例如，如果要修改Element UI中的按钮样式，可以在组件内添加以下样式：

<template>
  <el-button>按钮</el-button>
</template>

<style scoped>
  .el-button {
    background-color: red;
    border-color: red;
  }
</style>

这样，只有当前组件内部的按钮样式会被修改。

2. 使用全局样式

如果想要修改所有的Element UI组件的样式，可以在项目的全局样式中添加样式。例如，在`App.vue`的样式中添加以下样式：

<template>
  <router-view />
</template>

<style>
  /* 修改所有按钮的样式 */
  .el-button {
    background-color: red;
    border-color: red;
  }
</style>

这样，所有的Element UI按钮都会被修改。注意，全局样式的优先级比组件内部的样式高。

3. 使用自定义主题

Element UI提供了自定义主题的功能，可以通过修改主题变量的值来修改组件的样式。具体操作可以参考Element UI官方文档：https://element-plus.org/#/zh-CN/component/custom-theme