vue 中的 css bug

求解：

项目中有一个按钮，按钮点击后会弹出一个窗口

这个窗口作为一个子组件引入按钮所在的父组件

大致为以下结构：

<div id="a">
    <按钮组件></按钮组件>
</div>
<style scoped>
　　#a：hover{
　　　　transform： translate（1.5px， 1.5px）
       }
</style>

当我给这个div用id选择器设置了以上样式，然后点击按钮之后打开的窗口也应用了这个样式，这里不是应该使用了scoped之后就不会继承到子组件？

求解答为什么会应用到窗口！！！