页面可以修改页面引入的组件样式 直接使用 /deep/
例如：
main页面 修改 a组件的样式

	<style lang="scss" scoped>
	<template>
		<view>
			<a-d class="a-d"></a-d>
		</view>
	</template>
	<script>
		import a from "@/components/a.vue";
		export default {
			components: {
				"a-d": a
			}
		}
	</script>
	<style lang="scss">
		.a-d /deep/ .a{
			color: red;
		}
	</style>
</style>

重点：组件中样式不能直接穿透组件，需要在页面中穿透组件（也就是说在页面中组件的样式再写组件中的组件的样式），参考下列写法

main.vue 这是一个页面

<template>
	<view>
		<a-d class="a-d"></a-d>
	</view>
</template>
<script>
	import a from "@/components/a.vue";
	export default {
		components: {
			"a-d": a
		}
	}
</script>
<style lang="scss" scoped>
	.a-d /deep/ .a{
		color: red;
		.b{
			color: blue;
		}
	}
</style>

这是 a 组件

a 组件不包含样式

<template>
	<view class="a">
		<text>a</text>
		<b-d class="b-d"></b-d>
	</view>
</template>

<script>
	import b from "./b.vue";
	export default {
		components:{
			"b-d": b
		},
		name:"a"
	}
</script>

这是 b 组件

b 组件不包含样式

<<template>
	<view class="b">
		<text>b</text>
	</view>
</template>
<script>
	export default {
		name:"b",
	}
</script>