AmazeUI常用的辅助---类

这些类其实和bootstrap中的一些类很相似，可以多记记，这样效率会高点，当然也可以不记，用的时候查文档也行，但是推荐一劳永逸的做法。

默认class中以am开头的，非特殊情况下都是amazeUI中的类名。

另外自己在命名类名的时候尽量不要以am开头，类似与angular中的指令都是以ng-开头，自己封装指令的话尽量不要与官方写法相同，以免冲突。

.am-container 放到网格中

.am-center {
        display: block;
        margin-left: auto;
        margin-right: auto;
}

.am-cf {
  .clearfix();
}

原理： 将父容器内的 “幽灵”元素（使用伪元素）高度设置为 100%，再通过设置需要对齐的元素 vertical-align 属性实现。

.am-vertical-align 将这个 class 添加到父容器，父容器需要指定高度。
- .am-vertical-align-middle 需要垂直居中的元素
- .am-vertical-align-bottom 添加到需要底部对齐的元素

示例1：


  
    我是需要垂直居中的元素！

示例2：


  
    我是底部对齐的元素！

无论该元素是垂直居中对齐，还是底部对齐，都要给包裹该元素的父元素添加一个类 .am-vertical-align;

原理如下：

.am-hide {
  display: none !important;
  visibility: hidden !important;
}

不加尺寸为默认大小（16px），{size} 可以为 0, xs, sm, lg, xl 中之一。

示例：设置外边距

同理，可以设置 上/下/左/右/水平/垂直 方向的 内边距，只需将上面类中的margin改为 padding 即可；