menu

在这个框架中,每一个元素都一个z方向的深度,这个决定了这个元素是远离页面还是贴近页面。

你可以很简单的应用一个阴影效果,通过增加class="z-depth-2"类到HTML标签中。或者你可以继承这些阴影通过Sass,通过使用@extend .z-depth-2. A z-depth-0 来移除元素原有的深度的阴影。


    <div class="col s12 m2">
      <p class="z-depth-1">z-depth-1</p>
    </div>
    <div class="col s12 m2">
      <p class="z-depth-2">z-depth-2</p>
    </div>
    <div class="col s12 m2">
      <p class="z-depth-3">z-depth-3</p>
    </div>
    <div class="col s12 m2">
      <p class="z-depth-4">z-depth-4</p>
    </div>
    <div class="col s12 m2">
      <p class="z-depth-5">z-depth-5</p>
    </div>