saas-export项目-AdminLTE介绍与入门

AdminL介绍

• AdminLTE是一款建立在bootstrap和jquery之上的开源的模板主题工具
• AdminLTE特点
  》提供一系列响应的，可重复使用的组件，并内置了多个模板页面
  》自适应多种屏幕分辨率，兼容PC和移动端
  》快速的创建一个响应式的html5网站
  》AdminLTE不但美观，而且可以免去CSS和JS的工作量

AdminLTE入门程序

• 在官网上面下载文件
  官方原版
  https://adminlte.io/
  https://github.com/ColorlibHQ/AdminLTE
  
• 创建项目，引入css/js等静态资源
• 创建index.jsp页面
• 复制模板文件（all-admin-datalist.html）到index.jsp页面
• 把这个文件目录下的这四个文件复制粘贴到webapp目录下。
• 使用项目路径${path}替换掉…/
  …/plugins——》 ${path}/plugins
  …/css ——》 ${path}/css
  …/img ——》 ${path}/img

pom.xml

<!--web基础包 -->
    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>servlet-api</artifactId>
      <version>2.5</version>
      <scope>provided</scope>
    </dependency>
    <dependency>
      <groupId>javax.servlet.jsp</groupId>
      <artifactId>jsp-api</artifactId>
      <version>2.0</version>
      <scope>provided</scope>
    </dependency>
    <dependency>
      <groupId>jstl</groupId>
      <artifactId>jstl</artifactId>
      <version>1.2</version>
    </dependency>

对左侧菜单进行删除与修改

• 为了页面维护方便，将菜单内容移到left_menu.jsp中，在使用include引入当前页面
• 创建怯耶管理菜单

index.jsp

  <!-- 导航侧栏 -->
    <jsp:include page="left_menu.jsp"/>
    <!-- 导航侧栏 /-->

• 把其他我们不需要的标签都删除掉，只留两个子项