bootstrap登陆界面模板(响应式web开发项目教程)

背景

虽然当前前端大行其道,各种框架层出不穷,随之而来的是学习成本的提升,有些时候甚至是为了学习而学习,可能自己并不会用得到,加重了自己的心理负担,特别是对后端程序员来说,并不是所有人都能够跟得上前端的脚步,因此,今天分享一个免费的前端后台管理模板——Gentelella Admin,这在Github上也斩获了17+star,可见还是有很多人需要的。


界面美观且友好的前端Bootstrap 3管理模板

介绍

Gentelella Admin是一个免费使用Bootstrap管理模板。此模板使用默认的Bootstrap 3样式以及各种强大的jQuery插件和工具来创建用于创建管理面板或后端仪表板的强大框架。主题使用多个库来进行图表,日历,表单验证,向导样式界面,离开画布导航菜单,文本表单,日期范围,上传区域,表单自动完成,范围滑块,进度条,通知等等。

快速开发

  • 克隆仓库
git clone https://github.com/ColorlibHQ/gentelella.git

界面美观且友好的前端Bootstrap 3管理模板
  • 如果你没有安装gulp,则安装gulp
npm install -g gulp

  • 安装项目依赖
npm install

  • 输入gulp启动
gulp

  • 打开浏览器查看结果

界面美观且友好的前端Bootstrap 3管理模板

效果预览

在线演示地址:

https://colorlib.com/polygon/gentelella/index.html


  • 面板页面(首页)

界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
  • 表单

界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
  • 一些高级组件

界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
  • 表单验证

界面美观且友好的前端Bootstrap 3管理模板
  • 分步表单

界面美观且友好的前端Bootstrap 3管理模板
  • 上传表单

界面美观且友好的前端Bootstrap 3管理模板
  • 按钮

界面美观且友好的前端Bootstrap 3管理模板
  • 通用元素

界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
  • 媒体元素

界面美观且友好的前端Bootstrap 3管理模板
  • 图标

界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
  • 页面零部件

界面美观且友好的前端Bootstrap 3管理模板
  • 静态表格

界面美观且友好的前端Bootstrap 3管理模板
  • 数据表格

界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
  • 图表类(比较多,不一一截图)

界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
界面美观且友好的前端Bootstrap 3管理模板
  • 403页面(404、500类似)

界面美观且友好的前端Bootstrap 3管理模板
  • 登录页

界面美观且友好的前端Bootstrap 3管理模板
  • 付款元素

界面美观且友好的前端Bootstrap 3管理模板
  • 多级菜单

界面美观且友好的前端Bootstrap 3管理模板

项目用到的插件


  • Bootstrap
  • Font Awesome
  • jQuery-Autocomplete
  • FullCalendar
  • Charts.js
  • Bootstrap Colorpicker
  • Cropper
  • dataTables
  • Date Range Picker for Bootstrap
  • Dropzone
  • easyPieChart
  • ECharts
  • bootstrap-wysiwyg
  • Flot – Javascript plotting library for jQuery.
  • gauge.js
  • iCheck
  • jquery.inputmask plugin
  • Ion.RangeSlider
  • jQuery
  • jVectorMap
  • moment.js
  • Morris.js – pretty time-series line graphs
  • PNotify – Awesome JavaScript notifications
  • NProgress
  • Pace
  • Parsley
  • bootstrap-progressbar
  • select2
  • Sidebar Transitions – simple off-canvas navigations
  • Skycons – canvas based wather icons
  • jQuery Sparklines plugin
  • switchery – Turns HTML checkbox inputs into beautiful iOS style switches
  • jQuery Tags Input Plugin
  • Autosize – resizes text area to fit text
  • validator – HTML from validator using jQuery
  • jQuery Smart Wizard