这是一套非常优秀的纯静态后端管理模板————LightYearAdmin
lipiwang 2024-11-07 12:48 6 浏览 0 评论
介绍
光年后台管理模板(Light Year Admin)是一个基于Bootstrap v3.3.7的后台HTML模板。作为后端开发人员,自己在做一些简单系统时,经常为了后台的模板烦恼,因此今天向大家介绍一个对后端开发人员比较友好的管理模板,模板的作者本人也是一名开发人员,因此结合后端人员一些特点而开发的一套基于Bootstrap的管理模板,界面真的非常漂亮,而且功能也能满足大多数人需求!
Gitee坐标
https://gitee.com/yinqi/Light-Year-Admin-Template
https://gitee.com/yinqi/Light-Year-Admin-Using-Iframe
作者考虑到不同人群的开发习惯和方式,一共分为两半版本,一种是自带tab标签页的iframe版,另一种则是普通的页面版,可根据自己需要和业务需求选择不同的版本。
模板说明
- 普通版
网站主题切换,有默认白色,黑色,和渐变蓝绿色的半透明三种。另外:logo、顶部和侧边栏可单独调整颜色(黑色和半透明主题时选择白色不变)。
增加主题切换,增加了很多css,如果你不需要有主题切换功能,可将多余的内容删除掉。
- HTML页面中删除掉<!--切换主题配色-->之间的内容
- js中删除 line 137 - line 146
- css中删除 line 2937 - line 3946
主题切换并没有存到cookie中,大家根据自己实际情况,做cookie存储或者其他方式。
- jquery-cookie保存设置示例
// 读取cookie中的主题设置 var the_logo_bg = $.cookie('the_logo_bg'), the_header_bg = $.cookie('the_header_bg'), the_sidebar_bg = $.cookie('the_sidebar_bg'), the_site_theme = $.cookie('the_site_theme'); console.log(the_logo_bg); if (the_logo_bg) $('body').attr('data-logobg', the_logo_bg); if (the_header_bg) $('body').attr('data-headerbg', the_header_bg); if (the_sidebar_bg) $('body').attr('data-sidebarbg', the_sidebar_bg); if (the_site_theme) $('body').attr('data-theme', the_site_theme); // 设置主题配色 setTheme = function(input_name, data_name) { $("input[name='"+input_name+"']").click(function(){ $('body').attr(data_name, $(this).val()); $.cookie('the_'+input_name, $(this).val()); }); } setTheme('site_theme', 'data-theme'); setTheme('logo_bg', 'data-logobg'); setTheme('header_bg', 'data-headerbg'); setTheme('sidebar_bg', 'data-sidebarbg');
- iframe版
项目在Light Year Admin的基础上整理修改而来,用到了开源项目Bootstrap-Multitabs来实现多标签页,稍微做了一些修改。
- 相对于Light Year Admin的项目,去掉了暗黑和半透明的两个主题
- 所有需要的链接加上class="multitabs"
- 因为插件做了一些修改,在顶部的下拉菜单(dropdown-menu)中,不要把链接写在href里面,放到data-url里
- 插件用到了HTML5的会话存储,因此在修改了init里的默认地址后,可以再浏览器控制台执行下sessionStorage.clear(); // cache配置为true时
引用的第三方开源项目或者插件
普通版:
- Bootstrap(去掉了自带的字体图标)
- jQuery
- bootstrap-colorpicker
- bootstrap-datepicker
- bootstrap-datetimepicker
- ion-rangeslider
- jquery-confirm
- jquery-tags-input
- bootstrap-notify
- Chart.js
- chosen.jquery.js
- perfect-scrollbar
iframe版本:
- Bootstrap(去掉了自带的字体图标)
- JQuery
- bootstrap-colorpicker
- bootstrap-datepicker
- bootstrap-datetimepicker
- ion-rangeslider
- jquery-confirm
- jquery-tags-input
- bootstrap-notify
- Chart.js
- chosen.jquery.js
- perfect-scrollbar
- Bootstrap-Multitabs
模板截图
一共有两个版本,这里我们选择带有tab的iframe版本的进行截图演示:
以上是部分页面的截图,已经包括了很多功能在里面,包括列表、表单、分步表单、主体配色、多级菜单、模态框、确认框、提示、登录、404等!另附两张普通版中的暗色系以及彩色系主题:
总结
LightYearAdmin管理模板对后端人员可以说非常的友好了,笔者认为从配色、样式、布局、操作等方面都非常友好,如果你正好缺一款属于适合的模板,不妨试试看!
PS:相关文件在Gitee上都可以下载,这是纯静态模板,适合任何后端语言进行配合开发!大家也可以多多支持模板作者!谢谢!
相关推荐
- linux实例之设置时区的方式有哪些
-
linux系统下的时间管理是一个复杂但精细的功能,而时区又是时间管理非常重要的一个辅助功能。时区解决了本地时间和UTC时间的差异,从而确保了linux系统下时间戳和时间的准确性和一致性。比如文件的时间...
- Linux set命令用法(linux cp命令的用法)
-
Linux中的set命令用于设置或显示系统环境变量。1.设置环境变量:-setVAR=value:设置环境变量VAR的值为value。-exportVAR:将已设置的环境变量VAR导出,使其...
- python环境怎么搭建?小白看完就会!简简单单
-
很多小伙伴安装了python不会搭建环境,看完这个你就会了Python可应用于多平台包括Linux和MacOSX。你可以通过终端窗口输入"python"命令来查看本地是否...
- Linux环境下如何设置多个交叉编译工具链?
-
常见的Linux操作系统都可以通过包管理器安装交叉编译工具链,比如Ubuntu环境下使用如下命令安装gcc交叉编译器:sudoapt-getinstallgcc-arm-linux-gnueab...
- JMeter环境变量配置技巧与注意事项
-
通过给JMeter配置环境变量,可以快捷的打开JMeter:打开终端。执行jmeter。配置环境变量的方法如下。Mac和Linux系统在~/.bashrc中加如下内容:export...
- C/C++|头文件、源文件分开写的源起及作用
-
1C/C++编译模式通常,在一个C++程序中,只包含两类文件——.cpp文件和.h文件。其中,.cpp文件被称作C++源文件,里面放的都是C++的源代码;而.h文件则被称...
- linux中内部变量,环境变量,用户变量的区别
-
unixshell的变量分类在Shell中有三种变量:内部变量,环境变量,用户变量。内部变量:系统提供,不用定义,不能修改环境变量:系统提供,不用定义,可以修改,可以利用export将用户变量转为环...
- 在Linux中输入一行命令后究竟发生了什么?
-
Linux,这个开源的操作系统巨人,以其强大的命令行界面而闻名。无论你是初学者还是经验丰富的系统管理员,理解在Linux终端输入一条命令并按下回车后发生的事情,都是掌握Linux核心的关键。从表面上看...
- Nodejs安装、配置与快速入门(node. js安装)
-
Nodejs是现代JavaScript语言产生革命性变化的一个主要框架,它使得JavaScript从一门浏览器语言成为可以在服务器端运行、开发各种各样应用的通用语言。在不同的平台下,Nodejs的安装...
- Ollama使用指南【超全版】(olaplex使用方法图解)
-
一、Ollama快速入门Ollama是一个用于在本地运行大型语言模型的工具,下面将介绍如何在不同操作系统上安装和使用Ollama。官网:https://ollama.comGithub:http...
- linux移植(linux移植lvgl)
-
1uboot移植l移植linux之前需要先移植一个bootlader代码,主要用于启动linux内核,lLinux系统包括u-boot、内核、根文件系统(rootfs)l引导程序的主要作用将...
- Linux日常小技巧参数优化(linux参数调优)
-
Linux系统参数优化可以让系统更加稳定、高效、安全,提高系统的性能和使用体验。下面列出一些常见的Linux系统参数优化示例,包括修改默认配置、网络等多方面。1.修改默认配置1.1修改默认编辑器默...
- Linux系统编程—条件变量(linux 条件变量开销)
-
条件变量是用来等待线程而不是上锁的,条件变量通常和互斥锁一起使用。条件变量之所以要和互斥锁一起使用,主要是因为互斥锁的一个明显的特点就是它只有两种状态:锁定和非锁定,而条件变量可以通过允许线程阻塞和等...
- 面试题-Linux系统优化进阶学习(linux系统的优化)
-
一.基础必备优化:1.关闭SElinux2.FirewalldCenetOS7Iptables(C6)安全组(阿里云)3.网络管理服务||NetworkManager|network...
- 嵌入式Linux开发教程:Linux Shell
-
本章重点介绍Linux的常用操作和命令。在介绍命令之前,先对Linux的Shell进行了简单介绍,然后按照大多数用户的使用习惯,对各种操作和相关命令进行了分类介绍。对相关命令的介绍都力求通俗易懂,都给...
你 发表评论:
欢迎- 一周热门
- 最近发表
- 标签列表
-
- maven镜像 (69)
- undefined reference to (60)
- zip格式 (63)
- oracle over (62)
- date_format函数用法 (67)
- 在线代理服务器 (60)
- shell 字符串比较 (74)
- x509证书 (61)
- localhost (65)
- java.awt.headless (66)
- syn_sent (64)
- settings.xml (59)
- 弹出窗口 (56)
- applicationcontextaware (72)
- my.cnf (73)
- httpsession (62)
- pkcs7 (62)
- session cookie (63)
- java 生成uuid (58)
- could not initialize class (58)
- beanpropertyrowmapper (58)
- word空格下划线不显示 (73)
- jar文件 (60)
- jsp内置对象 (58)
- makefile编写规则 (58)