欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

解决vue中样式标记为Scoped时,element plus修改css样式无效的问题

程序员文章站 2022-06-07 13:35:45
...

在vue组件中,为了使样式私有化(模块化),不对全局造成污染,可以在style标签上添加scoped属性以表示它的只属于当下的模块。但是同时,scoped也会阻碍我们修改第三方组件库(element plus)的样式。

解决方法:使用 /deep/ 或者 >>> 样式穿透。
例如:

.el-table >>> .row-done {
  text-decoration: line-through;
}
</style>

或者

.el-table /deep/ .row-done {
  text-decoration: line-through;
}
</style>