material design lite学习（七）按钮

在MDL中定义了各种style的按钮。本博文通过一些的例子，介绍这些按钮的设置和使用方法。

1. 默认的mdl按钮

        <main class="mdl-layout__content">
            <button class="mdl-button mdl-js-button">确定</button>
            <button class="mdl-button mdl-js-button">确定</button>
        </main>

上面的代码定义了两个默认的mdl按钮。默认的mdl按钮需要给button标签添加两个css类。其中mdl-button类定理最基本的按钮特性，而mdl-js-button定义了基本的javascript响应逻辑。

默认的mdl按钮在没有鼠标进入时为透明色，当有鼠标进入时为半透明的灰色。下图中第一个按钮为没鼠标进入的效果，第二个按钮为鼠标进入的效果。

2. 带波纹动画效果的mdl按钮

        <main class="mdl-layout__content">
            <button class="mdl-button mdl-js-button mdl-js-ripple-effect&#