fastadmin修改后台登录背景

背景

fastadmin 用习惯了,但是登录界面真的不好看,今天就修改一下。先看界面:

解决方案

1.安装插件:后台登录背景。

2.上传固定图片修改登录页面为如下:

<!DOCTYPE html>
<html>
<head>{include file="common/meta" /}<style type="text/css">body {color: #999;background-color: #f1f4fd;background-size: cover;}a {color: #444;}.login-screen {max-width: 430px;padding: 0;margin: 250px auto 0 auto;}.login-screen .well {border-radius: 7px;-webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);background: rgba(255, 255, 255, 1);border: none;/*overflow: hidden;*/padding: 0;}@media (max-width: 767px) {.login-screen {padding: 0 20px;}}.profile-img-card {width: 50px;height: 50px;display: block;-moz-border-radius: 50%;-webkit-border-radius: 50%;border-radius: 50%;margin: 0px auto 20px;border: 5px solid #fff;}.profile-name-card {margin: 10px auto 20px;text-align: left;font-size: 20px;font-weight: bold;color:#0d0d0d;}.login-head {background: #899fe1;border-radius: 7px 7px 0 0;}.login-form {padding: 40px 30px;position: relative;z-index: 99;}#login-form {margin-top: 20px;}#login-form .input-group {margin-bottom: 15px;}#login-form .form-control {font-size: 13px;}</style><!--@formatter:off-->{if $background}<style type="text/css">body{background-image: url('{$background}');}</style>{/if}<!--@formatter:on-->
</head>
<body>
<div class="container"><div class="login-wrapper"><div class="col-xs-12 col-sm-8"></div><div class="login-screen col-xs-12 col-sm-4"><div class="well"><!--<div class="login-head"><img src="__CDN__/assets/img/login-head.png" style="width:100%;"/></div>--><div class="login-form"><div class="col-xs-12 col-sm-12" style="padding-left: 0px;margin-bottom: 20px;"><div class="col-xs-12 col-sm-3" style="padding-left: 0px"><img id="profile-img" class="profile-img-card" src="__CDN__/assets/img/avatar.png"/></div><div class="col-xs-12 col-sm-9 pl-0" ><p id="profile-name" class="profile-name-card">{:$Think.config.site.name}</p></div></div><form action="" method="post" id="login-form"><!--@AdminLoginFormBegin--><div id="errtips" class="hide"></div>{:token()}<div class="input-group"><div class="input-group-addon"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></div><input type="text" class="form-control" id="pd-form-username" placeholder="{:__('Username')}" name="username" autocomplete="off" value="" data-rule="{:__('Username')}:required;username"/></div><div class="input-group"><div class="input-group-addon"><span class="glyphicon glyphicon-lock" aria-hidden="true"></span></div><input type="password" class="form-control" id="pd-form-password" placeholder="{:__('Password')}" name="password" autocomplete="off" value="" data-rule="{:__('Password')}:required;password"/></div><!--@CaptchaBegin-->{if $Think.config.fastadmin.login_captcha}<div class="input-group"><div class="input-group-addon"><span class="glyphicon glyphicon-option-horizontal" aria-hidden="true"></span></div><input type="text" name="captcha" class="form-control" placeholder="{:__('Captcha')}" data-rule="{:__('Captcha')}:required;length({$Think.config.captcha.length})" autocomplete="off"/><span class="input-group-addon" style="padding:0;border:none;cursor:pointer;"><img src="{:rtrim('__PUBLIC__', '/')}/index.php?s=/captcha" width="100" height="30" onclick="this.src = '{:rtrim('__PUBLIC__', '/')}/index.php?s=/captcha&r=' + Math.random();"/></span></div>{/if}<!--@CaptchaEnd-->{if $keeyloginhours>0}<div class="form-group checkbox"><label class="inline" for="keeplogin" data-toggle="tooltip" title="{:__('The duration of the session is %s hours', $keeyloginhours)}"><input type="checkbox" name="keeplogin" id="keeplogin" value="1"/>{:__('Keep login')}</label></div>{/if}<div class="form-group"><button type="submit" class="btn btn-success btn-lg btn-block" style="background:#708eea;">{:__('Sign in')}</button></div><!--@AdminLoginFormEnd--></form></div></div></div></div></div>
<div class="col-xs-12 col-sm-12 text-center"  style="margin-top: 100px"><p>Copyright © 2024 {:$Think.config.site.name} All Rights Reserved</p>
</div>
{include file="common/script" /}
</body>
</html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/486551.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Unreal Engine Groom打包没有物理模拟

编辑器中运行头发有物理模拟效果&#xff0c;打包后没有 Project Setting 加/HairStrands

MCU-USB转UART的底层逻辑

USB/UART Bridge: Understand Everything in Animations - Parlez-vous Tech 没有 USB 端口的 PC 如何与单片机通信&#xff1f; 答案就在 USB/UART 桥接器中。 无论是用于调试、连接 IoT 传感器还是进行工业监督&#xff0c;此桥接器都简化了硬件集成并使通信更加可靠。以…

仿真键盘输入遇到Edge环境不识别 回车符如何处理

这个问题我也是最近才遇到&#xff0c;可能现在大家都喜欢用新架构&#xff0c;基于网页来写应用管理软件。 当遇到Edge环境下&#xff0c;文本框不识别回车符如何处理&#xff0c;根据笔者经验可通过配置Edge 基于键盘管理设置来解决这个事情。如图 即在Edge浏览器环境下&…

在做题中学习(79):最小K个数

解法&#xff1a;快速选择算法 说明&#xff1a;堆排序也是经典解决问题的算法&#xff0c;但时间复杂度为&#xff1a;O(NlogK)&#xff0c;K为k个元素 而将要介绍的快速选择算法的时间复杂度为: O(N) 先看我的前两篇文章&#xff0c;分别学习&#xff1a;数组分三块&#…

【html网页页面009】html+css制作学校官网主题网页制作含登录(5页面附效果及源码)

校园网站主题网页制作 &#x1f964;1、写在前面&#x1f367;2、涉及知识&#x1f333;3、网页效果&#x1f308;4、网页源码4.1 html4.2 CSS4.3 源码获取w034学校网页源码及介绍链接 &#x1f40b;5、作者寄语 &#x1f964;1、写在前面 学校网站主题的网页 一共5个页面 网…

2024-12-08 数字人最新论文更新(MEMO, INFP, IF-MDM, SINGER, One Shot, One Talk, FLOAT等)

2024-12-08 数字人最新论文更新(MEMO, INFP, IF-MDM, SINGER, One Shot, One Talk, FLOAT等) 汇总一下最近一个星期的一些数字人论文的更新&#xff0c;我觉得比较有意思的一些文章比如SINGER&#xff0c;用Diffusion来做sing的talking head&#xff0c;确实是一个不错的文章&…

亚马逊云科技用生成式AI,向开发的复杂性动手了

生成式 AI、分布式扩展功能全面进化&#xff0c;还降价了。 同一天的发布&#xff0c;完全不同的方向。 今天凌晨&#xff0c;云计算巨头亚马逊云科技的 re:Invent 与大号创业公司 OpenAI 的发布「撞了车」。后者公布了一系列生成式 AI 应用&#xff0c;价格更贵、性能更强大&a…

HTML+CSS+JS实现简单的打字机

HTMLCSSJS实现简单的打字机 js /*** 动态打字效果函数* (select和element只能选择一个)* param {Object} options - 配置选项* param {string} options.select - 选择器&#xff0c;用于定位要显示文本的DOM元素("#id"或".class")* param {Object} optio…

[Collection与数据结构] 位图与布隆过滤器

&#x1f338;个人主页:https://blog.csdn.net/2301_80050796?spm1000.2115.3001.5343 &#x1f3f5;️热门专栏: &#x1f9ca; Java基本语法(97平均质量分)https://blog.csdn.net/2301_80050796/category_12615970.html?spm1001.2014.3001.5482 &#x1f355; Collection与…

探秘AES加密算法:多种Transformation全解析

&#x1f9d1; 博主简介&#xff1a;CSDN博客专家&#xff0c;历代文学网&#xff08;PC端可以访问&#xff1a;https://literature.sinhy.com/#/literature?__c1000&#xff0c;移动端可微信小程序搜索“历代文学”&#xff09;总架构师&#xff0c;15年工作经验&#xff0c;…

【Liunx篇】基础开发工具 - vim

文章目录 一.vim的基本概念1.正常/命令模式2.插入模式3.底行模式/末行模式4.视图模式5.替换模式 二.vim的基本操作1.进入vim&#xff1a;2.退出vim: 三.vim正常模式命令集1.光标定位&#xff1a;2.复制/粘贴3.撤销4.剪切/删除5. 更改 四.vim底行模式命令集1.保存/退出2.调出行号…

基于 Python、OpenCV 和 PyQt5 的人脸识别上课打卡系统

大家好&#xff0c;我是Java徐师兄&#xff0c;今天为大家带来的是基于 Python、OpenCV 和 PyQt5 的人脸识别上课签到系统。该系统采用 Python 语言开发&#xff0c;开发过程中采用了OpenCV框架&#xff0c;Sqlite db 作为数据库&#xff0c;系统功能完善 &#xff0c;实用性强…

在Linux(ubuntu22.04)搭建rust开发环境

1.安装rust 1.安装curl: sudo apt install curl 2.安装rust最新版 curl --proto ‘https’ --tlsv1.2 https://sh.rustup.rs -sSf | sh 安装完成后出现&#xff1a;Rust is installed now. Great! 重启当前shell即可 3.检验是否安装成功 rustc --version 结果出现&…

手机租赁系统全面解析与开发指南

内容概要 手机租赁系统已经成为现代商业中不可或缺的一部分&#xff0c;尤其是在智能手机普及的时代。随着消费者对新机型兴趣的不断增加&#xff0c;大家纷纷走上了“试一试再买”的道路&#xff0c;手机租赁这条路因此越走越宽。这部分的市场需求让创业者们看到了机会。不仅…

vue vxe-table 实现财务记账凭证

使用 vxe-table 实现财务记账凭证非常简单&#xff0c;实现在线实时编辑的记账凭证、自动合计金额等 官网&#xff1a;https://vxetable.cn/ <template><div><vxe-grid ref"gridRef" v-bind"gridOptions" v-on"gridEvents">&…

OpenNebula 开源虚拟平台,对标 VMware

Beeks Group 主要为金融服务提供商提供虚拟专用服务器和裸机服务器。该公司表示&#xff0c;转向 OpenNebula 不仅大幅降低了成本&#xff0c;还使其虚拟机效率提升了 200%&#xff0c;并将更多裸机服务器资源用于客户端负载&#xff0c;而非像以往使用 VMware 时那样用于虚拟机…

英文论文翻译成中文,怎样翻译更地道?

我是娜姐 迪娜学姐 &#xff0c;一个SCI医学期刊编辑&#xff0c;探索用AI工具提效论文写作和发表。 最近学员群有同学问&#xff0c;英文论文翻译成中文的解决方案—“DeepL翻译出来的内容总是有点别扭&#xff0c;ChatGPT能翻译的地道一些吗&#xff1f;”。 正好有位刚加入的…

算法-字符串-165.比较版本号

一、题目 二、思路解析 1.思路&#xff1a; 比较的是两个版本号它们以“.”作为分割的部分的有效值&#xff08;即数值&#xff09;是否一致 2.常用方法&#xff1a; 1.s.split("\\规则")&#xff0c;将字符串按参数规则进行分割并存储在字符串数组中 String[] str …

嵌入式软件C语言面试常见问题及答案解析(一)

本文中题目列表 1. 用预处理指令#define 声明一个常数,用以表明1年中有多少秒(忽略闰年问题)2. 写一个"标准"宏MIN ,这个宏输入两个参数并返回较小的一个。3. 预处理器标识#error的目的是什么?4. 嵌入式系统中经常要用到无限循环,你怎么样用C编写死循环呢?5. …

kubesphere服务报错 页面无法登陆

kubesphere的页面无法访问 查看pod服务&#xff0c;发现ks-apiserver的pod一直在重启 在所在node节点&#xff0c;执行dmesg -T 发现内存溢出 修改deploy的memory的配置 原本的request memory的值为100M 调整为2G 修改之后&#xff0c;服务正常启动&#xff0c;页面访问正常…