// 如果直接写一个全局样式的话,直接写成如下,所有组件的禁用样式都会受影响力
.is-disabled{
background-color: pink;
}
// 比如输入框加一个:disabled='true',那输入框的背景色就会变成粉色,必须添加作用域才可以,比如外面嵌套一个带类名的div
// html
<div class='ipt-warp'>
<el-input :disabled='true' />
</div>
<div class='btn-warp'>
<el-button type='primary' :disabled='true' />
</div>
// 样式部分
<style lang='less' scoped>
/deep/ .btn-warp{
.is-disabled{
background-color: pink
}
}
// ⚠️⚠️⚠️⚠️⚠️⚠️可以这么写更改el-button的样式
// 主要是这里 注意.el-button--primary和.is-disabled之间没有空格
.el-button--primary.is-disabled{
background-color: #333
// 或者修改hover active等
&:hover{
background-color: #ddd
}
}
// 同理其他按钮类型可以写 .el-button--danger.is-disabled{ ...样式 }
修改elementui(饿了么)button(按钮)is-disabled的样式影响其他例如输入框disabled的样式
于 2023-01-10 14:09:34 首次发布