How To Create Materialize CSS Shadow?

Materialize CSS Shadow

Materialize CSS shadow effect is used to provide shadow effects to the specific container.

How To Use Materialize CSS Shadow?

Materialize CSS shadow provides different special classes that are used to create a shadow effect of the existing container i.e card with shadow. These classes are .z-depth-0,.z-depth-1,.z-depth-2,.z-depth-3,.z-depth-0,.z-depth-5.Please keep in mind that .z-depth-0 is used to remove the shadow of the elements having z-depth by default.

General Syntax

<div class="card-panel z-depth-1"></div>

Source Code

<div class="container">
  <div class="card-panel">
    <p><b>Learn</b> HTML5</p>
  </div>
  <div class="card-panel z-depth-1">
    <p><b>Learn</b> CSS3</p>
  </div>
</div>

To read more about Materialize CSS Shadow, click here.