Как создать верхний и нижний колонтитулы, используя угловой материал

Question

Я пытаюсь создать верхний и нижний колонтитулы, используя угловой материал, может кто-нибудь, пожалуйста, подскажите мне, как это сделать или поделитесь со мной любыми примерами, чтобы спроектировать это.

Html

<mat-toolbar color="primary">
<span>Header</span>
</mat-toolbar>
<mat-card>@Copyright2019</mat-card>

Css

    .mat-card{
        color:white;
        background-color: #303F9F;
        border-radius: 0px;
        text-align:center;
        font-size: 20px;
    }
   .mat-toolbar{
   margin-bottom:875px;
}

Я создал верхний и нижний колонтитулы. Я использовал margin-bottom, чтобы сохранить промежуток между верхним и нижним колонтитулом. Пожалуйста, найдите ссылку ниже, чтобы посмотреть скриншот. https://imagizer.imageshack.com/img923/5535/XThUEX.png

Есть ли другой способ получить отзывчивый верхний и нижний колонтитулы, используя материал angular6.

Answer 1

Ну, я нашел это

// src/app/app.component.ts
...

    @Component({
      selector: 'app-root',
      template: `
        <!-- header -->
        <app-header></app-header>

        <!-- routes will be rendered here -->
        <router-outlet></router-outlet>

        <!-- footer -->
        <app-footer></app-footer>
      `,
      styles: []
    })

...

Проверьте это.Читать дальше полная информация