在Vue 项目中的 style 样式中，为什么要添加 scoped？

【概念释义】

在 Vue 项目 style 加 scoped 是为了样式隔离，防止本组件 CSS 泄漏到全局或其它组件，也避免全局选择器误伤子树。多人协作与 UI 库混用时，scoped 是组件级封装的基本手段。

【基础使用】

<style scoped>
.card { padding: 16px; }
</style>

编译后选择器带 data-v-xxx，只匹配本组件模板渲染出的节点。修改子组件内部需 :deep()。

【版本差异】

Vue 2/3 均支持；Vue3 推荐 :deep 替代 ::v-deep。