关于vue单页面的scoped覆写css问题

关于子组件的根元素

使用了默认的scoped属性之后，子组件会优先运行在该页面的与父组件同名的style，并且不会全面继承复写父组件的style样式，然而如果父组件的style也设置为scoped，那么子组件的根节点元素在受到自己的style样式影响的同时也会受到设置了scoped的父组件style的影响。

.vue模板中的样式是根据需要按需加载，访问一个页面该组件中的样式就会追加到head标签中，如果父子组件中都对某个子组件根节点元素进行了控制，则父组件里的样式会被后来的覆盖。

深选择器

如果想对设置了scoped的子组件里的元素进行控制可以使用’>>>’或者’deep’

一些预处理程序例如sass不能解析>>>属性，这种情况下可以用deep，它是>>>的别名，工作原理相同。