网页制作

amaze ui 的使用详细教程
网页制作 2024/11/15 佚名
3 2

今天老师给我讲解了amaze ui的使用，在此与大家分享我的学习笔记。amaze ui的官网虽然已经提供了具体的实现步骤，但是对于没有前台开发经验的我，理解起来还是很有困难的。

引言

一个前台页面的开发一般需要html、css、javascript三种技术的支持，amazui ui对一些css、js进行了封装，是其可供用户直接调用。

使用方法

amaze ui的使用通常有两种方式：css、js文件复制到项目中；采用cdn方式。（在开发过程中采用第一种方式；开发结束需要部署时，采用第二种方式。

具体解释见附录1）

方法一

1.将amaze ui对应的zip下载。

解压后查看该文件夹下的问assets文件，assets文件夹下又包括css、js文件夹，这两个文件就是amaze ui中封装，可供用用户直接使用的样式。

2.把上述提到的css、js文件夹拷贝到web项目的WebRoot下。

3.在项目中对样式进行使用。

注：使用hbuilder开发非常便捷。

amaze ui 的使用详细教程

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>hello amazeui</title>
</head>
<link rel="stylesheet" type="text/css" href="css/amazeui.min.css"/>
<script type="text/javascript" src="js/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js/amazeui.min.js"></script>
<body>
  <button class="am-btn-primary am-btn-block " >aaa</button>
</body>
</html>

方法二

在官网上获取js和css对应的地址，将他们引入到js中。但是使用amaze ui的js，需要jquery的支持，所以需要将其导入，导入次序要在js之前。

<!DOCTYPE html>
<html>
 <head>
<meta charset="utf-8" />
     <title></title  >
     <link rel="stylesheet" type="text/css" href="http://cdn.amazeui.org/amazeui/2.4.2/css/amazeui.min.css"/>
     <script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
     <script type="text/javascript" src="http://cdn.amazeui.org/amazeui/2.4.2/js/amazeui.min.js"></script>
	</head>
	<body>
	<button <span style="color:#ff0000;">class</span>="am-btn" value="aa">		
	</button>
	</body>
</html>

我们在class中使用amaze ui已经封装好的格式。

附录1

在开发过程中，使用的是hbuilder这个工具，如果将amaze ui的css、js导入到项目中，开发过程中工具本身会有提示；但是，当用户访问该网页时，每次都会请求本地的css和js资源，会增加部署该项目的服务器的负担。因此为了避免第二项问题，我们在部署项目时会改变成第二种方式。

总结

标签：
amaze,ui,的使用,amaze,ui,使用
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
岱庙资源网 Copyright www.zgmyg.com

评论“amaze ui 的使用详细教程”

暂无“amaze ui 的使用详细教程”评论...
www.zgmyg.com 岱庙资源网
129,905影音资源
244,626技术资源
111,817软件资源
578,645站长资源

更新日志

友情链接

杰晶网络 DDR爱好者之家 桃源资源网 杰网资源 富贵资源网 南强小屋 铁雪资源网 幽灵资源网 万梅资源网 狼山资源网 白云岛资源网 昆仑资源网 相思资源网 明霞山资源网 内蒙古资源网 黑松山资源网 茶园资源网 饿虎岗资源网 大旗谷资源网 常春岛资源网 岱庙资源网 兴国资源网 快活林资源网 蝙蝠岛资源网 帝王谷资源网 白云城资源网 伏龙阁资源网 清风细雨楼 天枫庄资源网 圆月山庄资源网 无争山庄资源网 神水资源网 移花宫资源网 神剑山庄资源网 无为清净楼资源网 金钱帮资源网 丐帮资源网 华山资源网 极乐门资源网 小李飞刀资源网 凤求凰客栈 风云阁资源网 金狮镖局 鸳鸯亭资源网 千金楼资源网 更多链接
岱庙资源网 Copyright www.zgmyg.com