目录
配置环境
错误方向
解决
总结
配置环境
pc端
node 16.14.0
npm 8.3.1
vue @vue/cli 5.0.8
错误方向
在使用element-ui时，发现有时候可以在控制台利用内置的类来改变节点元素样式，但是当数据一多就无法利用了（即，无效利用），并且，在无效后在其上添加会发现，添加的样式处于所需要绑定的上层，故又无效。
无效===>
style样式的优先度>类的优先度，故无法绑定所需，只能赋予其上层样式
解决
在局部样式中，利用element-ui中内置样式设置自定义样式前加上 /deep/
有效===>
将原有内置样式替换自定义样式，搞定 ！
总结
在网上总共有以下几种方法：
1、深度选择器：>>> 影响子组件
<style scoped>
.a >>> .b { /* ... */ }
</style>2、将样式定义到全局，分为有作用域和无作用域样式
<style>
/* 全局样式 */
</style>
<style scoped>
/* 本地样式 */
</style>
<!--需使用权重来实现覆盖样式-->
.aritle-page{ //你的命名空间
.el-tag { //element-ui 元素
margin-right: 0px;
}
}3、使用 lang="less" 嵌套样式写法
需引入（版本自定）
"less": "^4.1.2", "less-loader": "6.0",
<style lang="less" scoped>
.a {
.b{
.c{
/*样式*/
}
}
}
</style>可能还有方法，但本人没有尝试过，可能不全，但不推荐，毕竟需要嵌套或者覆盖
个人推荐 /deep/ 深度选择器写法文章来源：https://www.toymoban.com/news/detail-478542.html
仅个人学习，勿喷文章来源地址https://www.toymoban.com/news/detail-478542.html
到了这里，关于Element-ui踩的坑-“CSS样式”的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
