作用域样式
定义在组件的 `<style>` 标签内或 `App.vue` 中的样式，实际上在所有组件中都是全局可用的。
要使样式仅限于组件内部，我们可以使用组件上的 `scope` 属性：**`<style scoped>**
全局样式
写在任何 `*.vue` 文件 `<style>` 标签内的 CSS 都可以全局工作。
这意味着，如果我们例如在某个 `*.vue` 文件中的 `<style>` 标签内将 `<p>` 标签设置为粉色背景，这将影响该项目所有 `*.vue` 文件中的 `<p>` 标签。
示例
在此应用程序中，我们有三个 `*.vue` 文件：`App.vue`，以及两个组件 `CompOne.vue` 和 `CompTwo.vue`。
`CompOne.vue` 中的 CSS 样式会影响所有三个 `*.vue` 文件中的 `<p>` 标签。
<template>
<p>This p-tag belongs to 'CompOne.vue'</p>
</template>
<script></script>
<style>
p {
background-color: pink;
width: 150px;
}
</style>
作用域样式
为了避免一个组件中的样式影响其他组件中的元素样式，我们在 `<style>` 标签上使用 `scoped` 属性。
示例
`CompOne.vue` 中的 `<style>` 标签被赋予了 `scoped` 属性。
<template>
<p>This p-tag belongs to 'CompOne.vue'</p>
</template>
<script></script>
<style scoped>
p {
background-color: pink;
width: 150px;
}
</style>
