AdminLTE 3 Documentation

.bg-* much more. Custom Range / Switch For custom colored custom-range you can add this classes: .custom-range-* For custom colored custom-switch you can add this classes: .custom-switch-off-* (for custom switch off) .custom-switch-on-* (for custom switch on) Toasts You can also use bg-* beside the .toast to get a nice colored toast. Plugin Support You can use the all the colors above with these plugins: Bootstrap Slider .slider-* (wrapped around the slider) iCheck-Bootstrap .icheck-* ， e.g. a/a. Color Variations AdminLTE 3.0 provides a set of color variations to apply to your sidebar (light dark) navbar. You can combine any available color with these class prefixes: .navbar-* .sidebar-dark-* .sidebar-light-* .accent-* New You can use override the link/accent color in AdminLTE。

you need to add .anchor to you hidden anchor， you can add .accent-* to body. Info You can combine .navbar-* with .navbar-light or .navbar-dark. The following colors are available: Theme Colors Primary (primary) / Blue (blue) Secondary (secondary) Success (success) / Green (green) Info (info) / Cyan (cyan) Warning (warning) / Yellow (yellow) Danger (danger) / Red (red) Black/White Nuances Black (black) Gray Dark (gray-dark) Gray (gray) Light (light) Colors Indigo (indigo) Navy (navy) Purple (purple) Fuchsia (fuchsia) Pink (pink) Maroon (maroon) Orange (orange) Lime (lime) Teal (teal) Olive (olive) Tip! You can use these color variations even with .text-*， The starter page is a good place to start building your app if you’d like to start from scratch. The layout consists of four major parts: Wrapper .wrapper. A div that wraps the whole site. Main Header .main-header. Contains the logo and navbar. Sidebar .sidebar-wrapper. Contains the user panel and sidebar menu. Content .content-wrapper. Contains the page header and content. Layout Options Note! You cannot use both layout-boxed and layout-navbar-fixed or layout-footer-fixed at the same time. Anything else can be mixed together. AdminLTE 3.0 provides a set of options to apply to your main layout. Each one of these classes can be added to the body tag to get the desired goal. Fixed Sidebar: use the class .layout-fixed to get a fixed sidebar. Fixed Navbar: use the class .layout-navbar-fixed to get a fixed navbar. Fixed Footer: use the class .layout-footer-fixed to get a fixed footer. Collapsed Sidebar: use the class .sidebar-collapse to have a collapsed sidebar upon loading. Boxed Layout: use the class .layout-boxed to get a boxed layout that stretches only to 1250px. Top Navigation: use the class .layout-top-nav to remove the sidebar and have your links at the top navbar. Responsive Variations You can also use the following classes for responsive changes with placing Fixed Navbar: use the class .layout-*-navbar-fixed to get a fixed navbar. use the class .layout-*-navbar-not-fixed to get a not fixed navbar. Fixed Footer: use the class .layout-*-footer-fixed to get a fixed footer. use the class .layout-*-footer-not-fixed to get a not fixed footer. Tip! If you want to use anchors with a fixed navbar，。