【sass】 中使用 /deep/ 修改 elementUI 组件样式报错

element plus 想要覆盖组件的样式,想到了/deep/样式穿透,但样式一直不生效,代码如下:

<style scoped lang="sass">
.main_wrapper{
   
	padding: 0 53px
	position: relative
	top: -20px
}
>>> .el-tabs__item{
   
    height: 30px
    line-height: 30px
    color: #fff!important
}

</style>

上边的写法不会报错,但是也不会生效。改用下面的方式:

<style scoped lang="sass">
.main_wrapper{
   
	padding: 0 53px
	position: relative
	top: -20px
}
/deep/ .el-tabs__item{
   
    height: 30px
    line-height: 30px
    color: #fff!important
}

这样就报错了,SassError: expected selector

解决方法:

尝试用 ::v-deep 替换 /deep/ ,成功解决了问题。

<style scoped lang="sass">
.main_wrapper{
   
	padding: 0 53px
	position: relative
	top: -20px
}
::v-deep(.el-tabs__item){
   
    height: 30px
    line-height: 30px
    color: #fff!important
}

相关推荐

  1. sass使用 /deep/ 修改 elementUI 样式

    2024-02-11 06:12:02       47 阅读
  2. elementUI样式修改整理

    2024-02-11 06:12:02       42 阅读
  3. scss:修改element样式(el-select)

    2024-02-11 06:12:02       57 阅读
  4. ElementUitable使用row-class-name修改指定行

    2024-02-11 06:12:02       62 阅读
  5. sass 重写elementui样式

    2024-02-11 06:12:02       48 阅读
  6. 使用sass开发web-components

    2024-02-11 06:12:02       44 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-02-11 06:12:02       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-02-11 06:12:02       100 阅读
  3. 在Django里面运行非项目文件

    2024-02-11 06:12:02       82 阅读
  4. Python语言-面向对象

    2024-02-11 06:12:02       91 阅读

热门阅读

  1. redis单线程还快的原因

    2024-02-11 06:12:02       52 阅读
  2. 【讨论】C语言提高之指针表达式

    2024-02-11 06:12:02       47 阅读
  3. leetcode - 368. Largest Divisible Subset

    2024-02-11 06:12:02       42 阅读
  4. 从零开始:用 Rust 编写你的第一个 Web 服务

    2024-02-11 06:12:02       45 阅读
  5. 如何为Kafka加上账号密码(二)

    2024-02-11 06:12:02       53 阅读
  6. C#系列-C#访问MongoDB+redis+kafka(7)

    2024-02-11 06:12:02       51 阅读
  7. 最小生成树——Prim/Kruskal Python

    2024-02-11 06:12:02       51 阅读
  8. 迟旧迎新感悟

    2024-02-11 06:12:02       44 阅读