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

背景

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

---

---

介绍

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

快速开发

• 克隆仓库

git clone https://github.com/colorlibhq/gentelella.git

---

---

• 如果你没有安装gulp，则安装gulp

npm install -g gulp

---

• 安装项目依赖

npm install

---

• 输入gulp启动

gulp

---

• 打开浏览器查看结果

---

---

效果预览

在线演示地址：

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

---

• 面板页面（首页）

---

---

---

---

• 表单

---

---

---

---

---

• 一些高级组件

---

---

---

• 表单验证

---

---

• 分步表单

---

---

• 上传表单

---

---

• 按钮

---

---

• 通用元素

---

---

---

• 媒体元素

---

---

• 图标

---

---

---

---

• 页面零部件

---

---

• 静态表格

---

---

• 数据表格

---

---

---

---

---

---

---

• 图表类（比较多，不一一截图）

---

---

---

---

---

---

---

---

---

• 403页面（404、500类似）

---

---

• 登录页

---

---

• 付款元素

---

---

• 多级菜单

---

---

项目用到的插件

---

• 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