我试图仅在主页中更改导航栏的不透明度。我已将navbar组件链接到我的主页，并且我正在使用CSS中的：host（）元素进行更改，但无法正常工作。这是我的代码：
home.component.html
`
<!doctype html>
<html lang="en">
<body>
<!--Navbar-->
<vHub-navBar></vHub-navBar>
</body>
</html>
`
home.component.css
`
.bg-light:host(vHub-navBar){
opacity: 0.5;
}
`