Vue.js 组件css样式作用域

App.vue文件中普通的去定义的css样式，而子组件未定义css样式，App.vue文件中的css样式会影响其他的 子组件 的样式

当 子组件 中定义了 css样式，子组件的样式会覆盖  App.vue 中的样式

 

想要每个组件的 css 样式都是独立的，就在 <style> 标签上加上 scoped 

<style scoped>
  h1{
    color: #F00;
  }
</style>

这样，组件与组件之间的 css样式 只能作用于自己

 

如果您有什么不明白的地方或其它想问的可以关注我的公众号,给我留言,我会尽可能的帮您解决遇到的问题

ps:如果您对摄影感兴趣,也可以关注我的公众号,不定时会分享自己的摄影经验和调色设定,欢迎交流,哈哈哈哈哈