Blazor CSS 隔离不会覆盖引导程序样式

Question

我的组件名称是Account.razor

这条线在剃须刀组件内部运行良好

<style>
.tooltip-inner {
background-color: red;
}
</style>

但是，当创建Account.razor.css并放入相同的代码时，工具提示不会更改背景颜色。

Answer 1

检查以下内容(用您的项目名称代替我的项目名称(Blazor.Starter(：

1. 转到\Blazor。Starter\obj\Debug\net5.0\scopedcss\bundle，并检查是否有为项目生成的css文件，以及是否包含css。注意使用的id.page[b-l5khpg12dl] {..
2. 检查您在hosts/index文件-<link href="Blazor.Starter.styles.css" rel="stylesheet" />中引用的CSS
3. 检查浏览器中的html和类，确保您可以看到项目CSS文件，并且组件生成的html的ID是相同的。如果未清理并重新生成项目/库

Answer 2

我发现了问题。当引导工具提示元素出现时，它的html代码被添加到div之外；页面"；类，则它不再具有组件css的作用域，因为它在之外