图标开关/Icon toggle
MDL的图标开关/IconToggle组件是标准HTML元素checkbox input的增强版本。 图标开关组件包含一个标签和一个用户指定的图标按钮，图标的着色与否用来传达 当前选项是否被选中：
MDL的图标开关/IconToggle组件具有预定义的HTML结构：
<!--1. 声明组件容器-->
<label class="mdl-icon-toggle mdl-js-icon-toggle">
<!--2. 为checkbox input元素应用mdl样式类-->
<input type="checkbox" class="mdl-icon-toggle__input"/>
<!--3. 为图标元素应用mdl样式类-->
<i class="mdl-icon-toggle__label material-icons">format_bold</i>
</label>
配置选项
| MDL class | 说明 |
|---|---|
| mdl-icon-toggle | 声明元素为图标开关 |
| mdl-js-icon-toggle | 为图标开关添加基本的行为逻辑 |
| mdl-icon-toggle__input | 为input元素声明此样式 |
| mdl-icon-toggle__label | 为label元素声明此样式 |
| mdl-js-ripple-effect | 为点击动作添加水纹效果 |
增加一个笑脸（face）图标开关，设置其初始状态为选中