ElementUI修改默认样式,又不影响到其他组件
(1),修改全局的话,特别简单;直接在vue 中<style >.el-table th .cell{color:rgba(0,0,0,0.5)!important;}.el-table td .cell{color:rgba(0,0,0,1.8)!important;}</style>#注意,一定不要写 scop...
·
(1),修改全局的话,特别简单;直接在vue 中
<style >
.el-table th .cell{
color:rgba(0,0,0,0.5)!important;
}
.el-table td .cell{
color:rgba(0,0,0,1.8)!important;
}
</style>
#注意,一定不要写 scoped;因为是这私有的。这样就覆盖不了element-ui的样式了,层级不够高;
但是这么写也有一个弊端。会覆盖所有的页面同类名的,css全局的污染;不过还是有解决方法的;
<div id="colorBox">
<ul>
<li>123</li>
<li>321</li>
<li>456</li>
<li>654</li>
</ul>
</div>
<style >
/* 因为id是唯一的。所以就简单了解决了这个'污染'*/
#colorBox{
.el-table th .cell{
color:rgba(0,0,0,0.5)!important;
}
.el-table td .cell{
color:rgba(0,0,0,1.8)!important;
}
}
</style>
1.不是scoped
2.每个页面加一个唯一id标识,
更多推荐
已为社区贡献2条内容
所有评论(0)