Materialize CSS CardsMaterialize CSS provides different CSS classes to apply various predefined visual and behavioral enhancements to display various types of cards. | Index | Class name | Description |
|---|
| 1) | card | It is used to identify div element as a materialize card container. It is required on "outer" div. | | 2) | card-content | It is used to identify div as a card content container and is required on "inner" div. | | 3) | card-title | It is used to identify div as a card title container and is required on "inner" title div. | | 4) | card-action | It is used to identify div as a card actions container and assigns appropriate text characteristics to actions text. It is required on "inner" actions div; content goes directly inside the div with no intervening containers. | | 5) | card-image | It is used to identify div as a card image container and is required on "inner" div. | | 6) | card-reveal | It is used to identify div as a revealed text container. | | 7) | activator | It is used to identify div as a revealed text container and image to be revealer. It is used to show contextual information related to image. | | 8) | card-panel | It is used to identify div as a simple card with shadows and padding. | | 9) | card-small | It is used to identify div as a small sized card. Height: 300px; | | 10) | card-medium | It is used to identify div as a medium sized card. Height: 400px; | | 11) | card-large | It is used to identify div as a large sized card. Height: 500px; |
ExampleLet's take an example to demonstrate the use of card classes to showcase various types of cards. Test it NowOutput: 
|
Home
Python
Java
JavaScript
HTML
SQL
PHP
C#
C++
DS
Aptitude
Reasoning
Selenium
DBMS
C
Andriod
Interview Q