adminlte 入门

 时间:2026-02-14 02:22:09

1、初次使用,直接从它的官网下载最新版本。(百度搜索adminlte.io)

点击"download"按钮直接下载最新版本,点击"live preview"按钮可预览模板效果

adminlte 入门

2、AdminLTE提供了一个入门页面(starter.html),我们可以从它开始构建我们的网站

adminlte 入门

3、点开starter.html页面,我们能看到如下效果:

adminlte 入门

4、查看starter.html的源码,发现adminLTE的页面主要有五块区域:

.wrapper包住了body下的所有代码

.main-header里是网站的logo和导航栏的代码

.main-sidebar里是用户面板和侧边栏菜单的代码

.content-wrapper里是页面的页面和内容区域的代码

.main-footer里是页脚的代码

.control-sidebar里是页面右侧侧边栏区域的代码

adminlte 入门

5、我们可以调整body的样式,给我们的网站变换不同的皮肤

skin-blue:蓝色

skin-black:黑色

skin-purple:紫色 

skin-yellow:黄色

skin-red:红色

skin-green:绿色

同时调整下布局选项

fixed:固定

layout-boxed:盒子布局

layout-top-nav:顶部隐藏

sidebar-collapse:侧边栏隐藏

sidebar-mini:侧边栏隐藏时有小图标

adminlte 入门

6、PC端效果

adminlte 入门

7、移动端效果

adminlte 入门

8、AdminLTE模板主题工具是不是很好用啊

  • Win10如何连接XBOX360无线手柄
  • 华为手机申请解锁码及怎么解锁步骤_荣耀HUAWEI
  • csgo荒漠迷城怎么从中路封长箱视线烟?
  • 华硕飞行堡垒FX63与FX60不同之处盘点
  • 华为手机字库坏了怎么修理
  • 热门搜索
    南雄旅游 武汉到恩施旅游 深圳旅游社 阳江闸坡旅游攻略 北京春节旅游 中国旅游胜地四十佳 温州旅游网 阿联酋旅游攻略 铜川旅游景点大全 旅游管理就业前景