徽章/Badge
徽章/Badge向用户提供了发现额外信息的视觉线索，它通常是圆型，内容为数字 或其他字母，紧贴在宿主元素旁边：
徽章可以用来无侵入地吸引用户的注意力，例如：
- 一个新消息通知可以使用徽章提醒有几条未读信息
- 一个购物车未付款提醒可以使用徽章提醒购物车内的商品数量
- 一个加入讨论！按钮可以使用徽章提示当前已经加入讨论的用户数
使用MDL徽章组件很简单，为宿主元素添加mdl-badge样式类，然后在data-badge中设置 徽章内容：
<any class="mdl-badge" data-badge="1">...</any>
因为徽章组件的尺寸很小，所以不要放太多内容，通常data-badge的值设置为1~3个 字符。
配置选项
| MDL class | 说明 |
|---|---|
| mdl-badge | 声明当前元素为MDL徽章组件 |
| mdl-badge--no-background | 声明徽章组件不使用背景色 |
| data-badge | 徽章组件使用宿主元素上这个属性值来设置显示内容 |
将示例代码中的徽章改为无背景色样式！