1.放置在独立的位置

2.引入核心css与js

<link href="{sh::PUB}amaze-ui/css/amazeui.min.css" rel="stylesheet" type="text/css">
<link href="{sh::PUB}amaze-ui/css/amazeui.flat.min.css" rel="stylesheet" type="text/css">
<!--[if lt IE 9]>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
<script src="{sh::PUB}amaze-ui/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->
<!--[if (gte IE 9)|!(IE)]><!-->
<script src="{sh::PUB}amaze-ui/js/jquery.min.js"></script>
<!--<![endif]-->
<script src="{sh::PUB}amaze-ui/js/amazeui.min.js"></script>
<script src="{sh::PUB}amaze-ui/js/amazeui.widgets.helper.min.js"></script>
<script src="{sh::PUB}amaze-ui/js/handlebars.min.js"></script>

3.引入局部的html或js脚本

<form class="am-form am-form-horizontal" id="myform" method="post" action="">
<div class="am-form-group">
<label for="doc-ipt">分类名称</label>
<input type="text" name="name" class="" id="doc-ipt-name" placeholder="分类名称">
</div> <div class="am-form-group">
<label for="doc-ipt">分类排序</label>
<input type="number" name="sort" class="" id="doc-ipt-sort" placeholder="分类排序">
</div> <div class="am-form-group">
<p>
<button type="submit" class="am-btn am-btn-default">提交</button>
</p>
</div>
</form>

4.调试效果

具体请参考官网

http://amazeui.org/

amaze UI的使用的更多相关文章

  1. 幻灯片插件FlexSlider -- Amaze UI幻灯片参数

    用了Amaze UI 的人就知道,其幻灯片插件是 data-am-slider='{}'来传参数的:(以下代码来自Amaze UI 官网) <div data-am-widget="s ...

  2. 目前几款基于html5的前端框架:如Bootstrap、Foundation、Semantic UI 、Amaze UI

    Bootstrap是由Twitter在2011年8月推出的开源WEB前端框架,集合CSS 和HTML,使用了最新的浏览器技术,为快速WEB开发提供了一套前端工具包,包括布局.网格.表格.按钮.表单.导 ...

  3. DoNet开源项目-基于Amaze UI的点餐系统

    帮朋友做的点餐系统,主要是为了让顾客在餐桌上,使用微信扫描二维码,就可以直接点菜,吃完使用微信付款. 系统演示地址,账户名和密码均为:admin.(请不要删除admin用户) GitHub Clone ...

  4. 有了bootstrap,为什么还要做amaze ui

    1.Bootstrap介绍Bootstrap,来自 Twitter,是目前很受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加 ...

  5. 移动端 前端框架 amaze ui

    移动端 前端框架 amaze ui http://amazeui.org/?_ver=2.x

  6. Amaze UI 是一个移动优先的跨屏前端框架。 http://amazeui.org/

    http://amazeui.org/ Amaze UI 是一个移动优先的跨屏前端框架.... Amaze UI 以移动优先(Mobile first)为理念,从小屏逐步扩展到大屏,最终实现所有屏幕适 ...

  7. 十、VueJs 填坑日记之在项目中使用Amaze UI

    上一篇博文,我们把jQuery集成到了项目中,今天我们来集成Amaze ui(妹子UI).先来介绍一下妹子UI.Amaze UI 含近 20 个 CSS 组件.20 余 JS 组件,更有多个包含不同主 ...

  8. 十一、VueJs 填坑日记之使用Amaze ui调整列表和内容页面

    上一篇博文我们整合了Amaze ui,并且调整了一个头部header和底部footer文件,其实做起来也很简单,只要按照步骤来做,完全没有问题.今天我们来重新调整一下列表页面和内容页面,使我们做的后台 ...

  9. amaze UI 笔记 - CSS

    导航添加依据 http://amazeui.org/css/  下面内容属学习笔记,如有理解偏差和错误请留言相告,感谢!* =(官网这块写的很详细) 一.基本样式 1.统一样式 说明了为什么使用Nor ...

  10. amaze UI 如何添加原生表单验证

    这段时间做的一个项目,整个系统就一个页面,然后就是各种模态框,js里拼HTML代码,而且因为表单空留距离小,最后选定了amaze ui原生的表单验证 在amaze ui官网找到 表单验证. 但是ama ...

随机推荐

  1. ios简单数据库运用

    一.添加类 二.打开数据库 三.创表 四.插入数据 五.取出数据 一.添加类 1.在设置Linked Frameworks and Libraries 中,点加号并添加libsqlite3.0.dyl ...

  2. IO流05_OutputStream和Writer输出流

    [输出流中的字节流和字符流] [OutPutStream和Writer] [ OutputStream和Writer中包含的方法 ] void write(int c)       将指定的字节/字符 ...

  3. 谱曲软件-MuseScore

    谱曲软件-MuseScore 参考: 1.MuseScore官网 2.免费乐谱制作软体MuseScore

  4. 九度OJ 1283 第一个只出现一次的字符

    题目地址:http://ac.jobdu.com/problem.php?pid=1283 题目描述: 在一个字符串(1<=字符串长度<=10000,全部由大写字母组成)中找到第一个只出现 ...

  5. OpenJudge/Poj 1723 SOLDIERS

    1.链接地址: http://bailian.openjudge.cn/practice/1723/ http://poj.org/problem?id=1723 2.题目: 总时间限制: 1000m ...

  6. mysql查询语句分析 explain用法

    explain显示了mysql如何使用索引来处理select语句以及连接表.可以帮助选择更好的索引和写出更优化的查询语句. 使用方法,在select语句前加上explain就可以了,如: explai ...

  7. oracle,wamp,FZ突然出现问题,求解决方案(未解决,最终系统还原)

    -----背景------- 系统:win7  64位oracle 11g(11.1)每天都用oracle.用toad for oracle .电脑固定IP.未更改任何配置信息.用了几个月,突然出现了 ...

  8. Oracle的rowid结构解析

    SQL> select rowid,deptno from dept; ROWID                  DEPTNO ------------------ ---------- A ...

  9. WinForm小小应用

    制作日历计划任务 private void BeginTask() { Thread th = new Thread(//建立线程 (() =>//使用Lambda表达式 { while (tr ...

  10. 制作精灵(UI Sprite)

    怎样判断是否应该使用精灵 在一套UI中,精灵是一种非常常见的元件.当制作UI时,如果需要显示一张图片,需要先判断这个图片是否应该制作到图集里去,然后用精灵的方式去使用它,一般来说,可以遵循以下规律. ...