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. [.Net MVC] Win7下IIS部署

    这里简单的分三步实现网站的部署. 一.发布 VS2013中有发布选项,在需要发布的工程项目上(就是设置为启动项目的那个)右键,点“发布”选项: 然后会弹出一个窗口: 选择自定义,随便输入一个名字,然后 ...

  2. 09_httpclient测试SOAP协议

    [工程截图]注意:无需使用Wsimport生成客户端代码 [HttpClient.java] import java.io.ByteArrayOutputStream; import java.io. ...

  3. 关于C++对汉字拼音的处理——终结篇(补充)

    需要补充的有三个方面: 1.新华字典数据获取方法1: 点击这里 2.新华字典数据获取方法2: 点击这里 3.比较稳定的其它的汉字转拼音的方法: 点击这里 *注:由于内容较多3个部分分文3篇博客进行分别 ...

  4. SpringMVC控制器配置文件

    1 首先引入 xml 的约束 <?xml version="1.0" encoding="UTF-8"?> <beans xmlns=&quo ...

  5. ubuntu系统根目录下各个目录用途说明

    1./ 根目录     --------- 所有目录挂在其下 2./boot     --------- 存放Ubuntu内核和系统启动文件.系统启动时这些文件先被装载. 3./etc    ---- ...

  6. Java知识总结--JDBC&XML

    1说说jdbc连接数据库的步骤 1.注册驱动 2.获得连接 3.执行sql语句 4.获得结果集,进行结果集的处理 5.关闭结果集 6.关闭连接,释放资源 2 statement 和preparedst ...

  7. animation css3动画与CSS3 @keyframes担配使用创建往复平缓动画

    通过 @keyframes 规则,您能够创建动画. 创建动画的原理是,将一套 CSS 样式逐渐变化为另一套样式. 在动画过程中,您能够多次改变这套 CSS 样式. 以百分比来规定改变发生的时间,或者通 ...

  8. PHP中进制之间的互相转换

    常见的进制: 二进制   binary   ----->  bin 八进制   octal     ----->  oct 十进制   decimal ----->  dec 十六进 ...

  9. python log 层次结构

    文件结构 - run.py - b -- __init__.py run.py import logging import b log = logging.getLogger("" ...

  10. Codeforces Round #344 (Div. 2) C. Report

    Report 题意:给长度为n的序列,操作次数为m:n and m (1 ≤ n, m ≤ 200 000) ,操作分为t r,当t = 1时表示将[1,r]序列按非递减排序,t = 2时表示将序列[ ...