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

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

css 复制代码
<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>

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

css 复制代码
<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/ ,成功解决了问题。

css 复制代码
<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 小时前
web开发,在线%超市销售%管理系统,基于idea,html,jsp,java,ssh,sql server数据库。
java·前端·sqlserver·ssh·intellij-idea
不爱学英文的码字机器2 小时前
重塑 Web 性能:用 Rust 与 WASM 构建“零开销”图像处理器
前端·rust·wasm
浩星2 小时前
react的框架UmiJs(五米)
前端·javascript·react.js
子醉5 小时前
推荐一种适合前端开发使用的解决本地跨域问题的办法
前端
Niyy_5 小时前
前端一个工程构建多个项目,记录一次工程搭建
前端·javascript
xiangxiongfly9155 小时前
CSS link标签
前端·css
岁月宁静6 小时前
AI 多模态全栈应用项目描述
前端·vue.js·node.js
nn_(nana)7 小时前
修改文件权限--- chmod ,vi/vim,查看文件内容,yum-软件包管理器,systemctl管理系统服务
前端
烛阴8 小时前
从零开始掌握C#核心:变量与数据类型
前端·c#