登录、注册、忘记密码、首页HTML模板
<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>登录</title><style>body {display: flex;justify-content: center;align-items: center;height: 100vh;margin: 0;background-color: #000;font-family: Arial, sans-serif;user-select: none;}body::before {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: inherit;filter: blur(10px);z-index: -1;}.login-box {background-color: rgba(0, 0, 0, 0.5);padding: 30px;border-radius: 15px;backdrop-filter: blur(10px);width: 300px;border: 2px solid rgba(255, 255, 255, 0.2);transition: all 0.3s ease;position: relative;}.login-box h2 {margin: 0 0 30px 0;color: #fff;text-align: center;}.login-box input {width: calc(100% - 30px);padding: 15px;margin-bottom: 20px;border: 1px solid rgba(255, 255, 255, 0.2);border-radius: 8px;font-size: 16px;outline: none;transition: all 0.3s ease;color: #fff;background-color: rgba(0, 0, 0, 0.3);-webkit-appearance: none;-moz-appearance: none;appearance: none;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}.login-box input:focus {background-color: rgba(0, 0, 0, 0.5);border-color: rgba(255, 255, 255, 0.4);}.login-box button {width: 100%;padding: 15px;border: 1px solid rgba(255, 255, 255, 0.2);border-radius: 8px;background-color: rgba(0, 0, 0, 0.5);cursor: pointer;font-size: 16px;color: #fff;transition: all 0.3s ease;}.login-box button:hover {background-color: rgba(0, 0, 0, 0.7);border-color: rgba(255, 250, 255, 0.4);}.message {color: #fff;text-align: center;padding: 10px;border-radius: 8px;overflow: hidden;position: absolute;left: 0;right: 0;bottom: -60px;transition: opacity 0.3s ease;opacity: 0;margin: 0 auto;background-color: rgba(0, 0, 255, 0.3); }.link {color: #fff;text-align: center;margin-top: 20px;cursor: pointer;}</style>
</head>
<body><div class="login-box"><h2>登录</h2><form action="#"><div class="input-container"><input type="text" id="username" placeholder="用户名" autocomplete="off"></div><div class="input-container"><input type="password" id="password" placeholder="密码" autocomplete="off"></div><button type="submit" id="loginButton">登录</button></form><div class="message" id="message"></div><div class="link"><span id="registerLink">前往注册</span> | <span id="forgetPasswordLink">忘记密码</span></div></div><script>document.getElementById('loginButton').addEventListener('click', function(event) {event.preventDefault();const username = document.getElementById('username').value;const password = document.getElementById('password').value;const message = document.getElementById('message');if (username && password) { message.innerHTML = '登录成功';showMessage();clearInputsAndMessage();setTimeout(() => {window.location.href = 'index.html';}, 300);} else {message.innerHTML = '登录失败,请输入用户名和密码';showMessage();clearInputsAndMessage();}});document.getElementById('registerLink').addEventListener('click', function() {window.location.href = 'register.html';});document.getElementById('forgetPasswordLink').addEventListener('click', function() {window.location.href = 'resetPassword.html';});function showMessage() {const message = document.getElementById('message');message.style.opacity = '1';}function clearInputsAndMessage() {const message = document.getElementById('message');const username = document.getElementById('username');const password = document.getElementById('password');setTimeout(() => {message.innerHTML = '';message.style.opacity = '0';username.value = '';password.value = '';}, 3000);}</script>
</body>
</html>
<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>注册</title><style>body {display: flex;justify-content: center;align-items: center;height: 100vh;margin: 0;background-color: #000;font-family: Arial, sans-serif;user-select: none;}body::before {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: inherit;filter: blur(10px);z-index: -1;}.register-box {background-color: rgba(0, 0, 0, 0.5);padding: 30px;border-radius: 15px;backdrop-filter: blur(10px);width: 300px;border: 2px solid rgba(255, 255, 255, 0.2);transition: all 0.3s ease;position: relative;}.register-box h2 {margin: 0 0 30px 0;color: #fff;text-align: center;}.register-box input {width: calc(100% - 30px);padding: 15px;margin-bottom: 20px;border: 1px solid rgba(255, 255, 255, 0.2);border-radius: 8px;font-size: 16px;outline: none;transition: all 0.3s ease;color: #fff;background-color: rgba(0, 0, 0, 0.3);-webkit-appearance: none;-moz-appearance: none;appearance: none;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}.register-box input:focus {background-color: rgba(0, 0, 0, 0.5);border-color: rgba(255, 255, 255, 0.4);}.register-box button {width: 100%;padding: 15px;border: 1px solid rgba(255, 255, 255, 0.2);border-radius: 8px;background-color: rgba(0, 0, 0, 0.5);cursor: pointer;font-size: 16px;color: #fff;transition: all 0.3s ease;}.register-box button:hover {background-color: rgba(0, 0, 0, 0.7);border-color: rgba(255, 250, 255, 0.4);}.message {color: #fff;text-align: center;padding: 10px;border-radius: 8px;overflow: hidden;position: absolute;left: 0;right: 0;bottom: -60px;transition: opacity 0.3s ease;opacity: 0;margin: 0 auto;background-color: rgba(0, 0, 255, 0.3); }.link {color: #fff;text-align: center;margin-top: 20px;cursor: pointer;}</style>
</head>
<body><div class="register-box"><h2>注册</h2><form action="#"><div class="input-container"><input type="text" id="username" placeholder="用户名" autocomplete="off"></div><div class="input-container"><input type="text" id="account" placeholder="账号" autocomplete="off"></div><div class="input-container"><input type="email" id="email" placeholder="邮箱" autocomplete="off"></div><button type="submit" id="registerButton">注册</button></form><div class="message" id="message"></div><div class="link"><span id="loginLink">返回登录</span></div></div><script>document.getElementById('registerButton').addEventListener('click', function(event) {event.preventDefault();const username = document.getElementById('username').value;const account = document.getElementById('account').value;const email = document.getElementById('email').value;const message = document.getElementById('message');if (username && account && email) { message.innerHTML = '注册成功';showMessage();clearInputsAndMessage();} else {message.innerHTML = '注册失败,请输入用户名、账号和邮箱';showMessage();clearInputsAndMessage();}});document.getElementById('loginLink').addEventListener('click', function() {window.location.href = 'login.html';});function showMessage() {const message = document.getElementById('message');message.style.opacity = '1';}function clearInputsAndMessage() {const message = document.getElementById('message');const username = document.getElementById('username');const account = document.getElementById('account');const email = document.getElementById('email');setTimeout(() => {message.innerHTML = '';message.style.opacity = '0';username.value = '';account.value = '';email.value = '';}, 3000);}</script>
</body>
</html>
<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>忘记密码页面</title><style>body {display: flex;justify-content: center;align-items: center;height: 100vh;margin: 0;background-color: #000;font-family: Arial, sans-serif;user-select: none;}body::before {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: inherit;filter: blur(10px);z-index: -1;}.reset-box {background-color: rgba(0, 0, 0, 0.5);padding: 30px;border-radius: 15px;backdrop-filter: blur(10px);width: 300px;border: 2px solid rgba(255, 255, 255, 0.2);transition: all 0.3s ease;position: relative;}.reset-box h2 {margin: 0 0 30px 0;color: #fff;text-align: center;}.reset-box input {width: calc(100% - 30px);padding: 15px;margin-bottom: 20px;border: 1px solid rgba(255, 255, 255, 0.2);border-radius: 8px;font-size: 16px;outline: none;transition: all 0.3s ease;color: #fff;background-color: rgba(0, 0, 0, 0.3);-webkit-appearance: none;-moz-appearance: none;appearance: none;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}.reset-box input:focus {background-color: rgba(0, 0, 0, 0.5);border-color: rgba(255, 255, 255, 0.4);}.reset-box button {width: 100%;padding: 15px;border: 1px solid rgba(255, 255, 255, 0.2);border-radius: 8px;background-color: rgba(0, 0, 0, 0.5);cursor: pointer;font-size: 16px;color: #fff;transition: all 0.3s ease;}.reset-box button:hover {background-color: rgba(0, 0, 0, 0.7);border-color: rgba(255, 250, 255, 0.4);}.message {color: #fff;text-align: center;padding: 10px;border-radius: 8px;overflow: hidden;position: absolute;left: 0;right: 0;bottom: -60px;transition: opacity 0.3s ease;opacity: 0;margin: 0 auto;background-color: rgba(0, 0, 255, 0.3); }.link {color: #fff;text-align: center;margin-top: 20px;cursor: pointer;}</style>
</head>
<body><div class="reset-box"><h2>忘记密码</h2><form action="#"><div class="input-container"><input type="text" id="account" placeholder="账号" autocomplete="off"></div><div class="input-container"><input type="email" id="email" placeholder="邮箱" autocomplete="off"></div><button type="submit" id="resetButton">提交</button></form><div class="message" id="message"></div><div class="link"><span id="loginLink">返回登录</span></div></div><script>document.getElementById('resetButton').addEventListener('click', function(event) {event.preventDefault();const account = document.getElementById('account').value;const email = document.getElementById('email').value;const message = document.getElementById('message');if (account && email) { message.innerHTML = '密码重置请求已提交,请查收邮件';showMessage();clearInputsAndMessage();} else {message.innerHTML = '请输入账号和邮箱';showMessage();clearInputsAndMessage();}});document.getElementById('loginLink').addEventListener('click', function() {window.location.href = 'login.html';});function showMessage() {const message = document.getElementById('message');message.style.opacity = '1';}function clearInputsAndMessage() {const message = document.getElementById('message');const account = document.getElementById('account');const email = document.getElementById('email');setTimeout(() => {message.innerHTML = '';message.style.opacity = '0';account.value = '';email.value = '';}, 3000);}</script>
</body>
</html>
<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>首页</title><style>body {margin: 0;padding: 0;font-family: Arial, sans-serif;background-color: #000;user-select: none;}body::before {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: inherit;filter: blur(10px);z-index: -1;}.header {display: flex;justify-content: space-between;align-items: center;padding: 10px 20px;background-color: rgba(0, 0, 0, 0.7);border-bottom: 1px solid rgba(255, 255, 255, 0.2);}.system-logo {height: 40px;width: 40px;border-radius: 50%;}.logout {color: #fff;cursor: pointer;padding: 5px 10px;border: 2px solid rgba(255, 255, 255, 0.2);border-radius: 5px;transition: background-color 0.3s ease;}.logout:hover {background-color: rgba(255, 255, 255, 0.2);}.card-container {display: flex;flex-wrap: wrap;justify-content: flex-start;padding: 20px;}.card {flex: 0 0 calc(20% - 20px); background-color: rgba(0, 0, 0, 0.5);border-radius: 15px;backdrop-filter: blur(10px);border: 2px solid rgba(255, 255, 255, 0.2);margin: 10px;padding: 15px;box-sizing: border-box;display: flex;}.logo {flex: 0 0 30%;height: 80px;width: 80px;margin-right: 10px;border-radius: 20%;user-drag: none; }.card-content {flex: 0 0 70%;padding-left: 10px;}.card-content h3 {color: #fff;margin: 10px 0;}.card-content p {color: #fff;}.modal {display: none;position: fixed;z-index: 1;left: 50%;top: 50%;transform: translate(-50%, -50%);width: 300px;height: 150px;overflow: auto;background-color: rgba(0, 0, 0, 0.8);border: 2px solid rgba(255, 255, 255, 0.2);border-radius: 10px;box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);}.modal-content {padding: 20px;}.modal-content p {color: #fff; text-align: center;}.modal-buttons {display: flex;justify-content: center;margin-top: 20px;}.modal-buttons button {margin: 0 10px;padding: 10px 20px;cursor: pointer;border: none;border-radius: 5px;background-color: #007BFF;color: #fff;transition: background-color 0.3s ease;}.modal-buttons button:hover {background-color: #0056b3;}</style>
</head>
<body><div class="header"><div class="logo-container"><img class="system-logo" src="https://img2.baidu.com/it/u=3565369971,2082314928&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1736960400&t=2bbb8a8e0be6e8ae7d1b4713751f1b0f" alt="System Logo" draggable="false"></div><div class="logout" id="logout">退出登录</div></div><div class="card-container"><div class="card"><img class="logo" src="https://img2.baidu.com/it/u=3565369971,2082314928&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1736960400&t=2bbb8a8e0be6e8ae7d1b4713751f1b0f" alt="Card Logo" draggable="false"><div class="card-content"><h3>测试</h3><p>测试测试测试测试测试</p></div></div></div><div class="modal" id="modal"><div class="modal-content"><p>是否确认退出登录?</p><div class="modal-buttons"><button id="confirmLogout">确认</button><button id="cancelLogout">取消</button></div></div></div><script>document.getElementById('logout').addEventListener('click', function() {document.getElementById('modal').style.display = 'block';});document.getElementById('confirmLogout').addEventListener('click', function() {window.location.href = 'login.html';document.getElementById('modal').style.display = 'none';});document.getElementById('cancelLogout').addEventListener('click', function() {document.getElementById('modal').style.display = 'none';});</script>
</body>
</html>
相关文章:
登录、注册、忘记密码、首页HTML模板
<!DOCTYPE html> <html lang"zh"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>登录</title><style>body {display: fl…...
HTML文章翻页功能
效果展示: 效果原理: 1、引入CDN 2、绘制文章翻页样式,以及自动分段 3、获取窗口宽高,计算出当前文章总分段,并实现分页 4、完整代码 <!DOCTYPE html> <html><head><meta charset"utf-8&qu…...
JAVA安全编码规范
1. 数据校验 对外部输入进行校验入参的合法性, 防止内存越界,命令注入,SQL注入,格式化字符串漏洞 校验长度,范围,输入校验采用白名单形式 校验前做归一化处理,使用java.text.Normalizer的n…...
OpenGL —— 基于Qt的视频播放器 - ffmpeg硬解码,QOpenGL渲染yuv420p或nv12视频(附源码)
运行效果 工程说明 源码 vertex.glsl...
爬虫逆向学习(十五):Akamai 3.0反爬分析与sensor-data算法逆向经验
此分享只用于学习用途,不作商业用途,若有冒犯,请联系处理 Akamai 3.0反爬分析与sensor-data算法逆向经验 Akamai开始正题前须知站点信息接口分析反爬点反爬点定位_abck定位结果 逆向前准备工作sensor_data生成位置本地替换文件 请求体sensor…...
java项目启动时,执行某方法
1. J2EE项目 在Servlet类中重写init()方法,这个方法会在Servlet实例化时调用,即项目启动时调用。 import javax.servlet.ServletException; import javax.servlet.http.HttpServlet;public class MyServlet extends HttpServlet {Overridepublic void …...
学会使用开源软件jclasslib 字节码文件的组成 详解
应用场景 1 应用场景 2 学习路线 以正确的姿势打开文件 字节码文件的组成 玩转字节码常用工具 以正确的姿势打开文件 开源软件 jclasslib github 地址 https://github.com/ingokegel/jclasslib 工具使用 字节码文件的组成 基本信息 常量池 字段 方法 属性 详解 魔数 主副版…...
Flask表单处理与验证
Flask是一个轻量级的Python框架,它通过扩展库提供了对表单处理与验证的支持。WTForms是一个流行的Flask扩展库,用于创建和验证Web表单。它提供了一种声明式的方法来定义表单结构和验证逻辑,使得表单处理更为简洁和优雅。下面,我们…...
如何通俗易懂的理解 html js css
HTML、CSS 和 JavaScript 是构建网页的三大核心技术。为了通俗易懂地理解它们,我们可以用一个简单的比喻:**盖房子**。 --- ### 1. **HTML:房子的结构** HTML(HyperText Markup Language)就像房子的**骨架**。它定义…...
信凯科技业绩波动明显:毛利率远弱行业,资产负债率偏高
《港湾商业观察》施子夫 1月8日,深交所官网显示,浙江信凯科技集团股份有限公司(以下简称“信凯科技”)主板IPO提交注册。 自2022年递交上市申请,信凯科技的IPO之路已走过两年光景,尽管提交注册࿰…...
蓝牙BT04-A的使用与相关AT指令
一、AT指令没有返回的问题及解决方案 检查指令格式: 确认指令格式是否正确,包括特定的命令和结尾的回车换行符(n)。 检查TX/RX连接: 确认TX(发送)和RX(接收)线是否连接正…...
新手如何练习SQL?|掌握
对于新手想要练习SQL语句,可以从以下几个方面入手: 1. 建立理论基础 首先深入理解数据库的核心组件,包括数据库本身、其内部的各个表、表中的字段及其对应的数据类型(如字符串、整型、日期等),以及数据库…...
JavaScript宝典下
小哆啦闭关修炼已久,潜心攻读专业秘技,方才下山考研本欲大展宏图,怎奈山河虽壮志难酬,终是觉察考研无望。思来想去,不若弃考研之念,重拾敲代码之道,复盘前端奇术,以备闯荡职场江湖。…...
浅谈云计算12 | KVM虚拟化技术
KVM虚拟化技术 一、KVM虚拟化技术基础1.1 KVM虚拟化技术简介1.2 KVM虚拟化技术架构1.2.1 KVM内核模块1.2.2 用户空间工具(QEMU、Libvirt等) 二、KVM虚拟化技术原理2.1 硬件辅助虚拟化2.2 VMCS结构与工作机制 三、KVM虚拟化技术面临的挑战与应对策略3.1 性…...
Spring Boot 动态表操作服务实现
Spring Boot 动态表操作服务实现 Spring Boot 动态表操作服务实现1. 环境配置2. JdbcTemplate 的使用2.1 创建动态表2.2 动态添加字段2.3 动态删除字段2.4 动态修改字段类型2.5 删除表的方法实现 3. 小结3.1 可能的优化 Spring Boot 动态表操作服务实现 在现代的应用开发中&am…...
62_Redis服务器集群优化
Redis集群虽然具备高可用特性,且能实现自动故障恢复,但是如果使用不当,也会存在一些问题,总结如下。 集群完整性问题集群带宽问题数据倾斜问题客户端性能问题命令的集群兼容性问题Lua和事务问题1.集群完整性问题 在 Redis 集群的默认配置下,当节点检测到存在至少一个哈希…...
晨辉面试抽签和评分管理系统之九:随机编排考生的分组(以教师资格考试面试为例)
晨辉面试抽签和评分管理系统(下载地址:www.chenhuisoft.cn)是公务员招录面试、教师资格考试面试、企业招录面试等各类面试通用的考生编排、考生入场抽签、候考室倒计时管理、面试考官抽签、面试评分记录和成绩核算的面试全流程信息化管理软件。提供了考生…...
Linux Top 命令 load average 指标解读
前言 作为平台开发的同学,维护平台稳定性是我们最基本的工作职责,下面主要介绍下top 命令里 ,load average 这个指标如何去衡量机器负载程度。 概念介绍 load average 是系统在过去 1 分钟、5 分钟、15 分钟 的平均负载,它表示运…...
Nacos: 一个动态服务发现与配置管理平台
Nacos: 一个动态服务发现与配置管理平台 引言 在微服务架构日益普及的今天,服务之间的调用和配置管理变得越来越复杂。为了简化这一过程并提高开发效率,阿里巴巴推出了Nacos——一个易于使用的动态服务发现、配置管理和服务管理平台。 Nacos是什么&am…...
SpringBoot + 事务钩子函数
一、案例背景 拿支付系统相关的业务来举例。在支付系统中,我们需要记录每个账户的资金流水(记录用户A因为哪个操作扣了钱,因为哪个操作加了钱),这样我们才能对每个账户的账做到心中有数,对于支付系统而言&…...
OpenCV相机标定与3D重建(56)估计物体姿态(即旋转和平移)的函数solvePnPRansac()的使用
操作系统:ubuntu22.04 OpenCV版本:OpenCV4.9 IDE:Visual Studio Code 编程语言:C11 算法描述 使用RANSAC方案从3D-2D点对应关系中找到物体的姿态。 cv::solvePnPRansac 是 OpenCV 中用于估计物体姿态(即旋转和平移)的…...
【JVM中的三色标记法是什么?】
JVM中的三色标记法是什么? 一、基本概念二、标记过程三、优势与问题四、漏标与多标的解决方案三色标记法(Tri-color Marking Algorithm)是Java虚拟机(JVM)中一种用于追踪对象存活状态的垃圾回收算法。 它基于William D. Hana和Mark S. McCulleghan在1976年提出的两色标记法…...
从0开始学习搭网站第二天
前言:今天比较惭愧,中午打铲吃了一把,看着也到钻二了,干脆顺手把这个赛季的大师上了,于是乎一直到网上才开始工作,同样,今天的学习内容大多来自mdn社区mdn 目录 怎么把文件上传到web服务器采用S…...
43.Textbox的数据绑定 C#例子 WPF例子
固定最简步骤,包括 XAML: 题头里引入命名空间 标题下面引入类 box和block绑定属性 C#: 通知的类,及对应固定的任务 引入字段 引入属性 属性双触发,其中一个更新block的属性 block>指向box的属性 从Textbo…...
钉钉实现第三方登录示例(重复回调问题解析)
钉钉作为专门为企业打造的沟通协助平台,包含的功能很多,考勤打卡,审批,日记,钉盘,钉邮等。基本满足了一些中小企业的大部分工作需求。因此对接钉钉的一些功能模块业务需求在开发中也是比较常见的。钉钉的开…...
Vue2+OpenLayers添加/删除点、点击事件功能实现(提供Gitee源码)
目录 一、案例截图 二、安装OpenLayers库 三、安装Element-UI 四、代码实现 4.1、添加一个点 4.2、删除所有点 4.3、根据经纬度删除点 4.4、给点添加点击事件 4.5、完整代码 五、Gitee源码 一、案例截图 可以新增/删除标记点,点击标记点可以获取到当前标…...
算法妙妙屋-------2..回溯的奇妙律动
回溯算法是一种用于系统性地搜索和解决问题的算法,它以深度优先搜索(DFS)为基础,用来探索所有可能的解决方案。通过递归地尝试候选解并在必要时回退(即“回溯”),它能够高效地解决许多涉及组合、…...
pytest-instafail:让测试失败信息即时反馈
pytest-instafail:让测试失败信息即时反馈 前言一、简介二、优势三、安装与使用3.1 未安装时运行情况3.2 安装3.3 已安装时运行情况3.3 pytest.ini 配置选项 四、对比 总结 前言 当测试用例数量庞大时,定位测试失败的原因往往耗时费力。此时,…...
K8S--配置存活、就绪和启动探针
目录 1 本人基础环境2 目的3 存活、就绪和启动探针介绍3.1 存活探针3.2 就绪探针3.3 启动探针 4 探针使用场景4.1 存活探针4.2 就绪探针4.3 启动探针 5 配置存活、就绪和启动探针5.1 定义存活探针5.2 定义一个存活态 HTTP 请求接口5.3 定义 TCP 的就绪探针、存活探测5.4 定义 g…...
solidity基础 -- 枚举
在智能合约开发领域,Solidity语言因其简洁高效而被广泛使用。其中,枚举(enum)作为一种特殊的数据类型,为合约的状态管理提供了极大的便利。本文将通过一个具体的Solidity合约示例,深入探讨枚举的定义、使用…...
重回C语言之老兵重装上阵(六)枚举
1. 什么是枚举 (enum)? 枚举(enum)是 C 语言中的一种数据类型,用于定义一组具名的整数常量。它可以使代码更加可读,帮助程序员更容易理解程序中的常量值。通过枚举,程序员可以使用有意义的名称来代替数字&…...
python+playwright自动化测试(一):安装及简单使用,截图录屏
目录 基本使用 浏览器调用 启用浏览器 创建窗口对象 访问URL 页面的刷新、返回、前进 关闭 截图、录屏、保存pdf 截图 录屏 保存为pdf 设置窗口大小 调试模式 手机模式及new_context的更多参数 手机模式 new_context的其他参数 设置语言和时区 设置和修改位置…...
Mysql--架构篇--体系结构(连接层,SQL层,存储引擎层,文件存储层)
MySQL是一种广泛使用的关系型数据库管理系统(RDBMS),其体系结构设计旨在提供高效的数据存储、查询处理和事务管理。MySQL的体系结构可以分为多个层次,每个层次负责不同的功能模块。 MySQL的体系结构主要由以下几个部分组成&#…...
git merge 压缩提交
在 Git 中,执行 git merge 时可以通过一些操作来“压缩”提交,通常是指将合并过程中的多个提交压缩成一个单一的提交。这可以通过使用 --squash 选项来完成,或者在合并后进行交互式 rebase。以下是两种常见的方法: 方法 1&#x…...
Python脚本自动发送电子邮件
要编写一个Python脚本来自动发送电子邮件,你可以使用smtplib库来处理SMTP协议,以及email库来构建邮件内容。 安装必要的库 通常情况下,smtplib和email库是Python标准库的一部分,因此不需要额外安装。如果你使用的是较旧的Python版…...
uniapp中rpx和upx的区别
在 UniApp 中,rpx 和 upx 是两种不同的单位,它们的主要区别在于适用的场景和计算方式。 ### rpx(Responsive Pixel) - **适用场景**:rpx 是一种响应式单位,主要用于小程序和移动端的布局。 - **计算方式**…...
CentOS 9 Stream 中查看 Python 版本并升级 Python
CentOS 9 Stream 中查看 Python 版本并升级 Python 1. 查看当前 Python 版本2. 升级 Python 版本(1)安装开发工具(2)安装必要的依赖包(3)下载和安装新版本的 Python(4)验证安装 3. …...
可以用于分割字符串的方法(python)
一、str.split(sep,maxsplit)函数(返回列表) sep:分隔符 maxsplit:分割次数 a"Hello world" list1a.split(" ",1) print(list1) 结果: [Hello, world] 二、str.rsplit(sep,maxsplit)函数&…...
【Vue】全局/局部组件使用流程(Vue2为例)
全局组件和局部组件区别 如何使用 全局组件:全局注册后,可以在任意页面中直接使用。局部组件:在页面中需要先导入子组件路径,注册组件才能使用。 适用场景 全局组件:适用于高频使用的组件,如导航栏、业…...
virtual box虚拟机误删Python3.6后导致UBUNTU18.04开机无UI界面(进不了desktop)的解决方法
最近在解决一个python引起的问题的时候,作者心一狠,删了系统自带的python3.6, 顺便还删了python3。导致重启后ubuntu的virtual box虚拟机无法看到UI登录界面,只给我了孤零零的命令行。装了很多东西不可能重装,无奈只能…...
虚拟线程JDK与Spring Core Reactor
两种虚拟线程对比:JDK vs. Spring Core Reactor性能对比 1、基于 JDK 的虚拟线程实现: 摘自实际代码: public static void withFlatMapUsingJDK() { ... var virtualThreadExecutor Executors.newThreadPerTaskExecutor( Thread .ofVirtual…...
纯 Python、Django、FastAPI、Flask、Pyramid、Jupyter、dbt 解析和差异分析
一、纯 Python 1.1 基础概念 Python 是一种高级、通用、解释型的编程语言,以其简洁易读的语法和丰富的标准库而闻名。“纯 Python” 在这里指的是不依赖特定的 Web 框架或数据分析工具,仅使用 Python 原生的功能和标准库来开发应用程序或执行任务。 1.…...
C++ NULL和nullptr
NULL实际是一个宏,在传统的C头文件(stddef.h)中,可以看到如下代码: #ifndef NULL #ifdef __cplusplus #define NULL 0 #else #define NULL ((void *)0) #endif #endif 如上是条件编译的宏定义 确保在不同编程环境下正确处理NULL的定义 C中NULL可能被定义…...
算法日记1:洛谷p2678跳石头(二分答案)
1、题目 二、题解: 2.1解题思路: 1.题目要求求出最小值最大,明显的二分答案题目,所以我们可以二分可以跳跃距离int l-1,rL1; 2.此时我们思考lmid和rmid的处理,当我们的check(mid)为true时候 表明我们此时的mid是符合要求的, 那么…...
PID控制器 (Proportional-Integral-Derivative Controller) 算法详解及案例分析
PID控制器 (Proportional-Integral-Derivative Controller) 算法详解及案例分析 目录 PID控制器 (Proportional-Integral-Derivative Controller) 算法详解及案例分析1. 引言2. PID控制器的基本概念2.1 PID控制器的定义2.2 PID控制器的核心思想2.3 PID控制器的应用领域 3. PID控…...
Vue中nextTick实现原理
源码实现思路(面试高分回答) 面试官问我 Vue 的 nextTick 原理是怎么实现的,我这样回答: 在调用 this.$nextTick(cb) 之前: 存在一个 callbacks 数组,用于存放所有的 cb 回调函数。存在一个 flushCallbac…...
【MATLAB】subplot如何增加title
在 Matlab 中,使用 subplot 函数将图形窗口划分为多个子图,并使用 title 函数为每个子图添加标题。以下是一个示例: matlab % 生成示例数据 x 0:0.1:10; y1 sin(x); y2 cos(x); % 创建一个 2 行 1 列的子图布局,并选…...
vue3+ts的<img :src=““ >写法
vue3ts的<img :src"" >写法<img :src"datasetImage" alt"数据分布示意图" /><script setup lang"ts">const datasetImage ref();datasetImage.value new URL(../../../assets/images/login-background.jpg, impo…...
Vue+Echarts+百度地图 实现 路径规划
实现功能: 通过选择 相关调拨,系统自动规划 路径,并且以地图的形式呈现最佳路径 技术难点: 1. vue 结合使用 echarts 2.echarts 在 vue嵌入百度地图,并且做出路径 曲线 最终结果:...
uniapp 小程序 textarea 层级穿透,聚焦光标位置错误怎么办?
前言 在开发微信小程序时,使用 textarea 组件可能会遇到一些棘手的问题。最近我在使用 uniapp 开发微信小程序时,就遇到了两个非常令人头疼的问题: 层级穿透:由于 textarea 是原生组件,任何元素都无法遮盖住它。当其…...