Bootstrap 4 使；“主要”；类div以用Razor填充整个页面

我与.NET Core Blazor平台的第一个项目比我想象的要难

项目立即创建了MainLayout.razor文件。我试图修改“main”类，所以 它将填满整个页面，但没有成功。这就是我现在所拥有的：

<div class="main mh-100 p-0" style="background-color:#1100ff">
 <nav class="navbar">
  <label class="navbar-brand">My Project</label>
 </nav>
 <div class="container p-0 align-self-center" style="background-color:#ff99ff">
  <div class="content">
   @Body
  </div>
 </div>
</div>

我的项目
@身体

---

我以为mh-100应该把最大高度提高到100%。非常感谢您的帮助，如果还有其他类似问题，我会提前道歉。

我认为这不是Blazor类型的问题，而是HTML/CSS问题。除了引导，如果您添加

宽度：100%
问题还可能是您将最大高度设置为100%，您应该查看（正常）高度。
因此这不是blazor的问题，与blazor的工作方式无关，但如果应用了正确的css样式，它将解决您的问题。你要做的是应用屏幕的高度。看看什么是css单元，什么最适合您：

在您的情况下，需要视口的高度：

div {
    height: 100vh;
}

例如：

在bootstrap 4.2+版本中，您可以使用
min-vh-100
或
vh-100
。更多细节
这是容器的100%，你的身体也应该有100%的高度。这显然解决了我的问题。你知道我是否可以使用一个与Bootstrap等价的类吗？是的，我已经用Bootstrap类更新了答案。