vue中怎么全局改变el-button的颜色
时间: 2024-01-09 18:50:59 浏览: 145
改变按钮颜色的方法
4星 · 用户满意度95%
你可以在 Vue 的样式表中使用以下代码来全局改变 el-button 的颜色:
```css
.el-button {
background-color: #f00; /* 设置按钮背景颜色 */
color: #fff; /* 设置按钮文字颜色 */
border-color: #f00; /* 设置按钮边框颜色 */
}
```
你也可以在 main.js 或 App.vue 中使用以下代码来全局注册 el-button 组件并设置主题颜色:
```js
import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI, { size: 'medium', theme: 'red' }) // 设置主题颜色为红色
```
注意,以上方法会全局改变所有的 el-button 组件的样式,如果需要更具体的控制,建议使用 scoped 样式表或单独为每个 el-button 组件设置 class。
阅读全文