一：悬浮按钮
悬浮按钮是一种有着特殊UI效果的按钮，它看起来就像悬浮在界面之上一样。
悬浮按钮点击时通常会展开一系列的选项按钮，十分酷炫。
新版F7中的悬浮按钮不仅仅是Material Design特有了，而是一种通用的UI控件。
二：悬浮按钮种类
1）按照它在界面中的位置来分类：
fab-right-bottomfab-center-bottomfab-left-bottomfab-right-centerfab-center-centerfab-left-centerfab-right-topfab-center-topfab-left-top
2）按照点击后效果分类
- 拨号盘(默认)：点击后展开多个按钮
- 渐变(fab-morph)：点击后，按钮变化为界面上的某个组成部分(如：底部工具栏)
四：按钮颜色
通过 color-xx 来指定颜色。
五：拨号盘悬浮按钮
<div class="fab fab-left-top color-yellow"> <!--1:定义悬浮按钮UI样式--> <a href="#"> <i class="icon f7-icons ios-only">add</I>//第一个标签为按钮关闭时样式 <i class="icon f7-icons ios-only">close</I>//第二个标签为按钮被点击打开后的样式 <i class="icon material-icons md-only">add</i> <i class="icon material-icons md-only">close</i> </a> <!--2:定义按钮展开内容 --> <div class="fab-buttons fab-buttons-bottom"> <a href="">按钮1</a> <a href="">按钮2</a> <a href="">按钮3</a> ...... </div> </div>
六：渐变悬浮按钮
<!-- 1:定义 FAB Morph Target(变化目标，点击悬浮按钮后才呈现)--> <div class="... fab-morph-target" id="变化目标id"> 内容... </div> <!-- 2:定义悬浮按钮，指定渐变类型以及变化目标--> <div class="fab fab-right-bottom fab-morph" data-morph-to="#变化目标id">
