vue.js - vue公共模块的样式冲突,怎么处理?
本文介绍了vue.js - vue公共模块的样式冲突,怎么处理?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
项目:vue1.0 + webpack
A.vue
<style scoped>
@import "../assets/css/common_player.css";
.button {
display: block;
width: 100%;
height: 40px;
background-color: #000000;
color: #fff;
text-align: center;
line-height: 40px;
}
</style>
如上面的代码,common_player.css样式只有部分页面在用,但是common_player.css样式由于其他页面的样式冲突了, 设置的scoped对import的样式没有作用,有没有好的办法来解决这个问题喃?难道必须重构css样式吗?
解决方案
设置了scoped的样式,无法起到覆盖其他样式的作用,这个问题我之前也碰到过,于是去掉了scoped, 因此在css class命名的时候就要注意了,加入命名空间的概念,尽量不要重复命名class,以免冲突。
这篇关于vue.js - vue公共模块的样式冲突,怎么处理?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文