API
API reference for Angular Material Card Component
import {MatCardModule} from '@angular/material';
A basic content container component that adds the styles of a Material design card.
While this component can be used alone, it also provides a number of preset styles for common card sections, see below:
|
Element |
Description |
|---|---|
|
<mat-card-title> |
Card title |
|
<mat-card-subtitle> |
Card subtitle |
|
<mat-card-content> |
Primary card content. Intended for blocks of text |
|
<img mat-card-image> |
Card image. Stretches the image to the container width |
|
<mat-card-actions> |
Container for buttons at the bottom of the card |
|
<mat-card-footer> |
Section anchored to the bottom of the card |
|
<mat-card-header> |
Optional header element to make rich header. It can contain mat-title, mat-subtitle and mad-card-avatar. |
|
<img mat-card-avatar> |
An image used as an avatar within the header. |
Note: mat-card-title and mat-card-subtitle will get title and body-variant respectively as default typography.
Examples
Content card
Portrait
Flat
Destination card
Default
Without booking guide