作用域樣式
定義在元件的 `<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>
