Materialize快速入门教程

materializecss.com/ github.com/Dogfalo/mat… www.materializecss.cn/

1，下载 materializecss.cn/bin/materia…

一般将javascript文件放在页面body标签的末端以减少页面的加载时间。 必须在materialize.js之前引入jQuery

在线演示示例 site.elesos.com/demo-web/st…

颜色 每一种颜色的定义有一个基本的颜色类和一个可选的减轻或变暗的类。 背景颜色： 只需要增加颜色的名称和颜色深浅度到元素的class属性中。

This is a card panel with a teal lighten-2 class

颜色值参考Color Palette： materializecss.com/color.html

---

网格: 用container类来包含我们的body内容,可以使你的页面内容居中。 s1 表示 small-1，他的意思是 "小屏幕中的一列"。 s = small, m = medium, l = large

布局

如果有三个等宽度的div，我们定义每个div的宽度是4列，4+4+4 = 12，加起来刚好是12。

导航布局

对齐

动态阴影

Hoverable Card Panel

更多参加示例页面：

site.elesos.com/demo-web/st…