vue样式加scoped后不能覆盖组件的原有样式解决方法

<style scoped>

</style>

为了vue页面样式模块化,不对全局造成污染,建议每个页面的style标签加上scoped,表示他的样式只属于当前的页面,父组件的样式不会泄漏到子组件中。但是scoped也会造成一些额外的负担,如无法覆盖原有组件的样式。 可以加 /deep/ 。

深度作用选择器 /deep/ or >>>

如果希望scoped样式中的选择器“深入”,即影响子组件

例子:

/deep/ .el-table .red-row {

background: #ffc2c2;

}

or

.el-table >>> .red-row {

background: #ffc2c2;

}

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容