目前项目中，一个页面用到电子看板，看板是以重色为底，当做完时发现，其它白底界面的也都成了重色底了，在百度上面查了许久没找到答案，大多说的是加scope就可以了，但实际操作不行，后来如下解决
1：首先在template标签下的第一个div中定义一个以本文件为名的class，只要class唯一就行，如：app-container,。
2：在style标签添加lang="scss"，并把所有的样式都包含在 .DeviceInfo{ }即可。如下图：

<style lang="scss" scoped>
.app-container {
  background-color: transparent;
  padding: 0px;
  margin: 0px; height:100%;
  background: url('../../assets/bg.png') center center no-repeat;
 .header-item{ color:cornflowerblue; font-size: 12px;}
.header{ background:#021036;color:#74777c; }
.row-item{
  border-bottom: 1px solid #113783; 
}
}
</style>

.a{
height:200;
font-size:12px
.b{.......}
.c{.......}
}
b和c样式必须要在a样式内，也就是a的div容器内

• 本文标题： Vue 单页样式影响全局所有页面样式，如何解决
• 文章分类：【VueJS】
• 非特殊说明，本文版权归【胡同里的砖头】个人博客 所有，转载请注明出处.

• 上一篇：watch监听器的用法
• 下一篇： DotNetCore使用PagedList.Core进行分页