简介
一种前端框架,类似于bootstrap
引入依赖
下载地址
http://www.jeasyui.com/download/downloads/jquery-easyui-1.7.0.zip
解压缩后将全部插件放进项目的js文件夹
ps:解压后是一堆插件css都在二级目录里了,和bootstrap的引入相比高下立判。。
写一个测试index.html试一下样式是否引入
注意,如果和上图的项目结构一致,则 src="js/jquery.easyui.min.js
不要写成 /js/…或.js/
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<!--引入jquery的js,EasyUI的执行需要依赖于jQuery -->
<!--引入jquery的js,EasyUI的执行需要依赖于jQuery -->
<script type="text/javascript"
src="js/jquery.min.js"></script>
<!--easyUI的js主文件 -->
<script type="text/javascript"
src="js/jquery.easyui.min.js"></script>
<!--国际化的js文件 -->
<script type="text/javascript"
src="js/locale/easyui-lang-zh_CN.js"></script>
<!--引入easyUI的样式 -->
<link rel="stylesheet" type="text/css"
href="js/themes/icon.css" />
<link rel="stylesheet" type="text/css"
href="js/themes/default/easyui.css" />
</head>
<body>
<div class="easyui-draggable">拖动DIV</div>
<div class="easyui-draggable">测试div</div>
<div id="p" class="easyui-progressbar" style="width:400px;"></div>
<input id="b" type="button" value="加载"/>
<a id="btn1" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-back'">返回</a>
<a id="btn2" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-add'">新增</a>
<a id="btn3" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-edit'">编辑</a>
<a id="btn4" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-clear'">清空</a>
<a id="btn5" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-remove'">移除</a>
</body>
</html>