bootstrap AdminLTE模版的使用
|
参考: ?https://adminlte.io/themes/AdminLTE/documentation/index.html ??https://blog.csdn.net/gebitan505/article/details/78680019 ? 1.adminLTE提供了基础模板页面starter.html，再此基础上做开发会快速很多 ? 2.?想开始使用adminLTE样式，只需要在项目演示中按F12打开调试窗口，使用箭头选中控件，复制粘贴即可（F12调是界面，鼠标选中控件，右键 Inspest Element） ? ? 在adminLTE给的index2.php代码中，有几点需要注意： 一、body样式： ?1、类hold-transition是对IE的transition做了一些修复，在body引用即可，没什么深层含义 ?2、皮肤的样式 ? ?侧边栏默认是暗色。 ?skin-blue中的 blue 蓝 修改的是标题的颜色， ?只有指定第二个颜色的时候才会改变侧边栏颜色， 如skin-blue-light中第二个颜色表示侧边栏为亮色。 adminLTE提供的默认皮肤颜色有： 蓝 skin-blue skin-blue-light? 黄 skin-yellow skin-yellow-light 绿 skin-green skin-green-light 紫 skin-purple skin-purple-light 红skin-red ?skin-red-light 字体黑，皮肤白 ?skin-black?skin-black-light 3、布局 ?默认侧边栏隐藏，标题不移动 ?<body class="hold-transition skin-blue"> Fixed 只是为了固定导航栏 layout-boxed ? ?只是将页面包含在一个固定盒子中，max-width最大宽度: 1250px; 当fixed布局和layout-boxed布局一起使用时，layout-boxed样式不会生效，只有fixed布局会生效 sidebar-collapse ?让侧边栏默认是隐藏状态 layout-top-nav ? 将导航栏设置为单纯的导航菜单，不使用侧边栏 ? sidebar-mini 让侧边栏和左侧导航一起折叠，并且最小化是小图标。 sidebar-mini一般和Fixed layout-boxed sidebar-collapse 一起配合使用，因为layout-top-nav布局的目的就是不要侧边栏 ?<body class="hold-transition skin-blue sidebar-mini"> ? ?二、body构造 ?<div class="wrapper"> ? ? <!-- 顶部导航栏 --> ? ? <header class="main-header"> ? ? ? </header> ? ? ? <!-- 左侧菜单栏 --> ? ? <aside class="main-sidebar"> ? ? ? </aside> ? ? ? <!-- 中间内容 --> ? ? <div class="content-wrapper"> ? ? ? </div> ? ? ? <!-- 底部标注 --> ? ? <footer class="main-footer"> ? ? ? </footer> ? ? ? <!-- 右侧菜单栏 --> ? ? <aside class="control-sidebar control-sidebar-dark"> ? ? </aside> ? ? <!-- 右侧菜单栏的样式，底部距离为0等 --> ? ? <div class="control-sidebar-bg"></div> ? </div> （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |