2.12 vue中css scoped的原理

1.在组件中增加的css加了scoped属性之后，就在会在当前这个组件的节点上增加一个 data-v-xxx属性。
2.此组件的所用的css，都会被设置为属性选择器例如下：

  /**
    之前
  **/
  .main{
     background-color:#FFFFFF;
     padding:0px;
     border:solid 1px #000000;
     border-radius:10px;
  }

 /**
   加上scoped之后，被编译之后的.main
 **/
 .main[data-v-xxx]{
     background-color:#FFFFFF;
     padding:0px;
     border:solid 1px #000000;
     border-radius:10px;
}

3.通过css的属性选择器从而解决了多个组件重复的class，会导致冲突的问题