框架简介
使用AX框架自身的组件可以自由创建多种风格的管理系统框架,理论上来说可以创建任意的带菜单的页面,包含不限于:API接口文档,产品手册,管理系统,网站地图等。
下载DEMO
为了方便用户学习和使用,本页面已经打包。
使用方法
在引入ax.css和ax.js之后,接着引入ax-admin02.css和ax-admin02.js即可。
框架布局
-
不同于ax-admin01.php使用了弹性布局,该框架布局上使用常规的布局方式,左侧菜单和头部使用fixed定位,main主体部分是常规的流体布局。
-
风格上使用的样式类主要包括:ax-admin,ax-body,ax-header-search,ax-nav-main,ax-aside-header,ax-footer等。
框架特点
- 支持对左侧菜单使用cookie,包括缩小到图标和全部隐藏。如取消请删除ax-admin02.js中相应代码。
- 适配了移动端,包括手机和平板。
- 集成了AX框架的menu菜单(使用详细),面包屑路径(使用详细),scrollnav菜单(使用详细)。
标准结构
<!DOCTYPE html>
<html>
<head>
...
</head>
<body class="ax-admin">
<nav class="ax-flex-col">
...
</nav>
<header class="ax-flex-row">
...
</header>
<div class="ax-space-header"></div>
<!--main-->
<main id="article01">
...
<footer>
...
</footer>
</main>
<div class="ax-scrollnav-v" id="article-nav01">
<a href="##" class="ax-close ax-iconfont ax-icon-arrow-right"></a>
</div>
</body>
</html>