Warning: fopen(https://www.tutorialsplane.com/card-image.png): failed to open stream: HTTP request failed! HTTP/1.0 404 Not Found in /home/u613989013/domains/tutorialsplane.com/public_html/wp-content/plugins/amp/includes/lib/class-fastimage.php on line 31
Angular Material Card Example | Demo | Tutorialsplane
Tutorialsplane

Angular Material Card


Angular Material – Card : The <md-card> directive is used to create Card in Angular Material. Various options are available to create cards. Here in this tutorial we are going to explain how you can create Angular Material card. You can also use our online editor to edit and run the code online.


Angular Material Card Example

Let us create basic Angular Material Card –

Example:

<md-card>
	 <amp-img src="card-image.png" class="md-card-image amp-wp-unknown-size amp-wp-enforced-sizes" alt="image caption" width="600" height="400" sizes="(min-width: 600px) 600px, 100vw"></amp-img>
	 <md-card-content>
	   <h2>Tutorialsplane.com</h2>
	   <p>The Simpleast way to learn everything.</p>
	 </md-card-content>
	 <md-card-footer>
	   visit : www.tutorialsplane.com
	 </md-card-footer>
</md-card>

Try it »

If you run the above example it will produce output something like this –

Following options are available –

Learn Angular Material