AUI框架的介绍和使用

简单来说，AUI框架就是一个用于移动端开发的前端框架，能够为你的移动端开发节省很多时间，并且为你提供好看的样式和更好的用户体验。如果想要进AUI官网查看详细的介绍，请点这里。

作为一个前端程序员，会使用框架是必须的。框架让你的代码更简洁。下面来介绍一下AUI框架的使用过程。

---

 第一步：下载AUI2.1

这是AUI框架的官网，首先我们需要点击下载AUI2.1按钮.下载的是一个压缩包，将解压后文件存放进你的项目里。如下图所示。

第二步：在项目中引用AUI

 你需要在你的页面中引入AUI文件，代码如下：

<link rel="stylesheet" type="text/css" href="aui-20170109-v2.1/css/aui.css" />
<script type="text/javascript" src="aui-20170109-v2.1/script/api.js"></script>

只有在页面中加入这两行代码，（如果使用的样式不涉及到JS特效，可以只引用aui.css文件）。

第三步：正式使用AUI

就是正式使用AUI框架来完成你的项目。在此过程中需要查阅AUI2.0文档。在官网中也提供了AUI2.0文档的链接，在右上角的文档中点击2.x文档即可。该文档详细描述了各种样式的使用方法。在此处举个简单的例子。

<div class="aui-btn aui-btn-info aui-btn-block aui-btn-outlined">默认按钮(info)</div>

这样一行简单的代码，就可以定义出一个好看的按钮样式并且自带点击样式，效果如下图：

 

---

如果需要用到如弹出框，图片轮播等效果时，还要引入其对应的js文件。具体可以在官网提供的AUI2.0文档中查看并使用。

本人为JS实习生一枚，不断学习，不断进步。欢迎各位前辈批评指教。