Css 覆盖角度7中的主体背景色

我一直试图覆盖我的登录和注册组件的后台主体，但它不起作用 我尝试添加一个div，其中CSS类设置了它的背景颜色，但是页面底部没有设置为我选择的颜色。 如果您能给我提供解决问题的最佳方法，我将不胜感激

  .login-page{
    height: 100% !important;
    background-color: #e40134 !important;
   }

---

在@组件处使用封装键

import {Component, ViewEncapsulation} from "@angular/core";

@Component({
  selector: 'login-page',
  templateUrl: './login-page.component.html',
  encapsulation: ViewEncapsulation.None
})

并在css中使用：：ng deep=>

例如：

::ng-deep .login-page {
    height: 100% !important;
    background-color: #e40134 !important;
}

以下是不同的封装方式：

尝试使用

  .login-page{
    height: 100vh !important;
    background-color: #e40134 !important;
   }

如果仍然没有预期的结果，可以添加

位置：绝对
。
在任何情况下，您都可以通过应用
边距：0
来重置正文。如果您使用浏览器查看，了解您看到的内容将非常有帮助。
我认为这实际上是一个问题，因为默认情况下您的页面有边距

因此，在
styles.scss
中，我只想添加以下内容：

body: {
  margin: 0
}

如果要更改某些组件中的实体类，请使用ngOnInit和Ngondestory

  //inject in the constructor the "document"
  constructor(@Inject(DOCUMENT) private _document) { }

  //in init you add a class to de body
  ngOnInit() {
    this._document.body.classList.add('new-body-class');
  }
  //in destroy remove the class
  ngOnDestroy() {
    this._document.body.classList.remove('new-body-class');
  }

及

newbody类可以是在
styles.css
中定义的类，也可以使用
viewenclosuration.None
。请小心，
ViewEncapsulation.None
使componet的.css对于所有应用程序都是通用的，因此如果您编写

h5{color:red}
.new-body-class{
   background-color: #e40134;
}

进一步更改背景，应用程序中的所有h5将变为红色
在浏览器控制台中检查组件时会看到什么？什么会覆盖上面的背景色？
h5{color:red}
.new-body-class{
   background-color: #e40134;
}