使用前端后台管理模板庫admin-lte
安裝
安裝admin-lte，可以通過以下幾種辦法安裝，下圖是GitHub中admin-lte的主頁:
通過github直接克隆安裝
git clone https://github.com/almasaeed2010/AdminLTE.git adminlte # 將這個resposity 克隆到adminlte
- 1
可以看到上圖的目錄結構
通過bower 安裝
bower安裝可以去查看bower官網，需要nodejs 環境支持。bower地址: https://bower.io/
- 1
- 2
搭建環境
依賴下載
目錄說明
上圖為目錄說明。
我們主要使用的事dist這個目錄
- 1
- 2
在adminlte/libs目錄存放框架庫。
建立第一個index.html 如下圖
直接導入css和js壓縮文件
AdminLTE.css 和 AdminLTE.min.css、 adminlte.min.js和 adminlte.js兩個文件內容都是一樣的，不過帶min的都是通過壓縮后的文件。
- 1
- 2
直接打開/libs/admin-lte/index.html 看到如下內容:
現在將四個不同顏色的框框顯示出來，就說明我們項目搭建成功了。
我們找到adlte中index.html 搜索關鍵詞 Orders 找到四個框框源碼的位置。然后復制，如下圖:
找到代碼以后復制進入index.html
得到下圖的index.html
然后用瀏覽器打開index.html如下圖:
這就說明了，adminlt環境基本搭建成功。
后續: 實際自己需要的樣式或者組件庫，導入不同的css，即可實現和admin-lte一樣的效果。adminlte.min.js 依賴於jquery，在admin的bower組件中所有依賴都下載完成了，直接導入使用就可以了。
祝您好運…