Vue中style的scoped属性以及穿透方法

1.什么是样式私有化：（scoped）？
在Vue组件中，为了使样式私有化（模块化），不对全局造成污染，可以在style标签上添加scoped属，使CSS样式只作用于当前的组件中，局部有效，使得组件之间的样式不互相污染。

<style lang="scss" scoped>

<style lang="less" scoped>

2.为什么需要样式穿透？
引用了第三方组件后，需要在组件中局部修改第三方组件的样式，而又不想去除scoped属性造成组件之间的样式污染。此时只能通过特殊的方式，穿透scoped。

样式穿透的方法
样式穿透的写法有三种：>>>、/deep/、::v-deep

less的样式穿透     /deep/ .var{color:red;}

scss的样式穿透    ::v-deep .var{color:red;}

......