Angular 5 - 设计容器未显示在整页中

时间:2018-02-16 19:28:29

标签: angular angular-material material

我制作了我的第一个角度5演示应用程序,但它没有出现在整页中 screenshot

这是代码

    <div class="container">
  <div class="row">
<mat-toolbar color="primary">
  <mat-toolbar-row>
    <span>MyMaterial</span>

    <span class="example-spacer"></span>

    <button mat-button>About</button>
    <button mat-button>Services</button>
  </mat-toolbar-row>
</mat-toolbar>


  <mat-form-field>
    <input matInput placeholder="First Name">
  </mat-form-field>
  <mat-form-field>
    <input matInput placeholder="Last Name">
  </mat-form-field>
  </mat-selection-list>
  </div>
</div>

1 个答案:

答案 0 :(得分:0)

大多数浏览器在html / body标签上都有默认填充,重置它将它放入你的css:

html, body {
  margin: 0;
  padding: 0;
}

您可以使用以下代码段自行尝试:

.box {
  height: 100vh;
  background: #f0f;
}

html:hover, body:hover {
  margin: 0;
  padding: 0;
}
<div class="box"></div>