css - Angular 7 模板没有填满整个页面

Question

所以我试图将此html页面转换为我的角度项目。它工作正常，但是当我使用 angular 时，它不会填满整个页面。这是一个stackblitz示例，这就是我所看到的。

https://stackblitz.com/edit/angular-y8tdkt

在新窗口中运行角度预览。

标签： cssangularangular7

Answer 1

在您的代码中，您将主体设置为显示 flex，这会导致问题，如果您删除您设置display: flex的body任何位置，屏幕将完全填充，就高度而言。

我似乎看不到你在哪里设置它，但为了表明它是这样的，添加以下内容以查看全高屏幕。（在style.css）。

body {
  display: unset!important;
}

---

编辑 - 发现问题

style.css在 ( ) 行 9622中找到它，这导致了您的问题。

body {
  position: relative;
  height: 100%;
  overflow: auto;
  display: flex;
  flex-direction: column;
  font-family: "Montserrat",sans-serif;
  word-break: break-word;
  -webkit-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
}

在display: flex这里，将其删除，页面未填满将不再是问题。