当前位置: 首页 > news >正文

好看的html登录界面,

界面效果:

在这里插入图片描述

代码:

<!DOCTYPE html>
<html><head><title>Login Page</title><style>body {background-color: #f2f2f2;font-family: Arial, sans-serif;}form {background-color: #fff;border-radius: 5px;box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);padding: 20px;width: 300px;margin: 0 auto;}h2 {text-align: center;}input[type="text"],input[type="password"] {width: 100%;padding: 12px 20px;margin: 8px 0;display: inline-block;border: 1px solid #ccc;border-radius: 4px;box-sizing: border-box;}button {background-color: #4CAF50;color: white;padding: 14px 20px;margin: 8px 0;border: none;border-radius: 4px;cursor: pointer;width: 100%;}button:hover {background-color: #45a049;}form {/* This centers the login form horizontally */margin: 0 auto;/* This centers the login form vertically *//* This centers the login form vertically and slightly towards the top */position: absolute;top: 50%;top: 40%;left: 50%;transform: translate(-50%, -50%);
}</style></head><body><form><h2>Login</h2><label for="username">Username</label><input type="text" id="username" name="username" placeholder="Enter your username"><label for="password">Password</label><input type="password" id="password" name="password" placeholder="Enter your password"><button type="submit">Login</button></form></body>
</html>

相关文章:

好看的html登录界面,

界面效果&#xff1a; 代码&#xff1a; <!DOCTYPE html> <html><head><title>Login Page</title><style>body {background-color: #f2f2f2;font-family: Arial, sans-serif;}form {background-color: #fff;border-radius: 5px;box-shado…...

Java模拟星空

目录 前言 JavaFX基础 1. GraphicsContext 2. AnimationTimer 代码实现 完整代码 前言 看了Python模拟星空很漂亮&#xff0c;Java也应该必须有一个&#xff01; 环境&#xff1a;只需要JDK1.8就好&#xff01;不需要外部包&#xff01;&#xff01;&#xff01; Jav…...

YGG 代表 Web3 Gaming 参加 2023 年游戏开发者大会

Yield Guild Games&#xff08;YGG&#xff09;在 2023 年 3 月 20 日至 24 日在加州旧金山举行的游戏开发者大会&#xff08;GDC&#xff09;上大显身手&#xff0c;这是游戏开发者的重要交流学习活动。虽然 GDC 本身提供了多种多样的活动&#xff0c;包括讲座、小组讨论、圆桌…...

水库安全运行智慧管理平台解决方案筑牢防汛“安全墙”

解决方案 水库安全运行智慧管理系统解决方案&#xff0c;系统主要由降雨量监测站、水库水位监测站、大坝安全监测中的渗流量、渗流压力和变形监测站及视频和图像监测站等站点组成&#xff0c;同时建立规范、统一的监测平台&#xff0c;集数据传输、信息共享、数据储存于一体&a…...

Exchange升级部署方案

目录 前言 一、需求分析 二、升级前准备 1.备份当前 Exchange Server 数据...

AE开发之图层渲染20210603

AE开发之图层渲染比例符号化地图的整饰唯一值符号的符号化过程点符号设置&#xff0c;线符号设置标注图层&#xff0c;&#xff08;写得不好&#xff0c;不推荐看) 唯一值符号化&#xff0c;字段进行设置&#xff0c;这里用到了UniqueValueRenderer接口&#xff0c;这里面有一…...

需要了解的过滤器

过滤器 1. 概念 过滤器&#xff1a; 从名字上理解就是对于事件的过滤操作&#xff0c;在web 中的过滤器&#xff0c;就是对于请求进行过滤操作&#xff0c;我们使用过滤器&#xff0c;就可以对于请求进行拦截操作&#xff0c;然后进行响应的处理操作&#xff0c;实现很多的特殊…...

VUE3的setup函数

文章目录 目录 文章目录 前言 一、setup函数是什么&#xff1f; 二、使用步骤 三、vue3中文文档和面向vue3的组件库 总结 前言 Vue3是一个面向数据驱动的渐进式JavaScript框架&#xff0c;其的设计理念包括简洁、灵活和高效。相比Vue2&#xff0c;Vue3的架构设计有很大的不同&…...

停车场管理系统文件录入(C++版)

❤️作者主页&#xff1a;微凉秋意 ✅作者简介&#xff1a;后端领域优质创作者&#x1f3c6;&#xff0c;CSDN内容合伙人&#x1f3c6;&#xff0c;阿里云专家博主&#x1f3c6; 文章目录一、案例需求描述1.1、汽车信息模块1.2、普通用户模块1.3、管理员用户模块二、案例分析三…...

线程(Thread)的三种等待唤醒机制详解

1、为什么需要线程的等待和唤醒 线程的等待唤醒机制是一种经典的“生产者和消费者”模型。例如食品加工厂&#xff0c;食品加工人员和原料补给人员&#xff0c;在有充足原料时&#xff0c;补给人员是在等待&#xff0c;等到原料不够时&#xff0c;食品加工人员通知补给人员&am…...

从零学习python - 13模块的导入与使用(实现单例模式)

模块基础知识 # 项目 > 包 > 模块 > 变量\方法\类 # 在python中,模块是代码组织的一种方式,把功能相近的函数或类放到一个文件中,一个文件(.py)就是一个模块,模块名就是文件名去掉py后缀. # 好处:提高代码可复用性和可维护性,一个模块编写完成后,很方便在其他项目中导…...

国产SSD、内存卷哭国外大厂,三星宣布减产涨价在路上了

PC 圈有一句话是这么说的&#xff1a;论价格屠夫还得看国产品牌&#xff01; 可不是嘛&#xff0c;国产长鑫、长江算是彻底将全球存储芯片市场搅局者这一「骂名」坐实了&#xff01; 不说特别早期&#xff0c;前几年吧&#xff0c;普通单条 8G DDR4 内存都能卖到六七百元&…...

数据库管理-第六十六期 SQL Domain(20230413)

数据库管理 2023-04-13第六十六期 SQL Domain1 基本介绍2 Domain的表达式和条件3 语法4 语义5 示例总结第六十六期 SQL Domain 上一期一笔带过了部分Oracle 23c的新特性&#xff0c;这一期重点讲一下SQL Domain新特性。 【https://docs.oracle.com/en/database/oracle/oracle-…...

《Vue3实战》 第一章 nods/npm安装、配置

1、nods.js安装&#xff08;Windows&#xff09; 1.1、下载并安装node https://nodejs.org/en/ , 安装到d盘nodejs目录 1.2、配置环境变量 path配置 1.3、配置全局包存放目录和缓存目录 在根目录下创建node_global&#xff08;全局包存放目录&#xff09;和node_cache&…...

JAVA练习104-四数相加 II

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 目录 前言 一、题目-四数相加 II 1.题目描述 2.思路与代码 2.1 思路 2.2 代码 总结 前言 提示&#xff1a;这里可以添加本文要记录的大概内容&#xff1a; 4月10日练…...

【C++基础】引用(引用的概念;引用的特性;常引用;使用场景:做输出型参数、大对象传参、做输出型返回值、返回大对象的引用);引用和指针的区别)

六、引用 6.1 引用的概念 引用不是新定义一个变量&#xff0c;而是给已存在变量取了一个别名&#xff0c;编译器不会为引用变量开辟内存空间&#xff0c;它和它引用的变量共用同一块内存空间。&#xff08;语法上&#xff09; 格式&#xff1a;类型& 引用变量名(对象名) …...

Redis只用来做缓存?来认识一下它其他强大的能力吧。

当今互联网应用中&#xff0c;随着业务的发展&#xff0c;数据量越来越大&#xff0c;查询效率越来越高&#xff0c;对于时序数据的存储、查询和分析需求也越来越强烈&#xff0c;这时候 Redis 就成为了首选的方案之一。 Redis 提供了多种数据结构&#xff0c;如字符串、哈希表…...

【ES】数据同步集群

【ES】数据同步&集群3.数据同步3.1.思路分析3.1.1.同步调用3.1.2.异步通知3.1.3.监听binlog3.1.4.选择3.2.实现数据同步3.2.1.思路3.2.2.导入demo3.2.3.声明交换机、队列1&#xff09;引入依赖2&#xff09;声明队列交换机名称3&#xff09;声明队列交换机3.2.4.发送MQ消息…...

37岁男子不愿熬夜,回乡养鸡每天准时下班,青山绿水中养鸡,直播间里卖鸡蛋...

37岁男子不愿熬夜&#xff0c;回乡养鸡每天准时下班&#xff0c;青山绿水中养鸡&#xff0c;直播间里卖鸡蛋。今天和大家分享一个创业案例&#xff0c;他叫胡铭浩&#xff0c;来自安徽省旌德县&#xff0c;今年37岁&#xff0c;曾做过车床操作工&#xff0c;开过婚纱摄影店&…...

深度学习和人工智能之间是什么样的关系?

深度学习与人工智能概念的潜在联系&#xff0c;我们依然借助维恩图来说明&#xff0c;如图4.1所示。 1、人工智能 “人工智能”这个概念新鲜时髦但又含混模糊&#xff0c;同时包罗万象。尽管如此,我们仍尝试对 人工智能进行定义:用一台机器处理来自其周围环境的信息,然后将这些…...

测试微信模版消息推送

进入“开发接口管理”--“公众平台测试账号”&#xff0c;无需申请公众账号、可在测试账号中体验并测试微信公众平台所有高级接口。 获取access_token: 自定义模版消息&#xff1a; 关注测试号&#xff1a;扫二维码关注测试号。 发送模版消息&#xff1a; import requests da…...

Java 语言特性(面试系列1)

一、面向对象编程 1. 封装&#xff08;Encapsulation&#xff09; 定义&#xff1a;将数据&#xff08;属性&#xff09;和操作数据的方法绑定在一起&#xff0c;通过访问控制符&#xff08;private、protected、public&#xff09;隐藏内部实现细节。示例&#xff1a; public …...

2025年能源电力系统与流体力学国际会议 (EPSFD 2025)

2025年能源电力系统与流体力学国际会议&#xff08;EPSFD 2025&#xff09;将于本年度在美丽的杭州盛大召开。作为全球能源、电力系统以及流体力学领域的顶级盛会&#xff0c;EPSFD 2025旨在为来自世界各地的科学家、工程师和研究人员提供一个展示最新研究成果、分享实践经验及…...

以下是对华为 HarmonyOS NETX 5属性动画(ArkTS)文档的结构化整理,通过层级标题、表格和代码块提升可读性:

一、属性动画概述NETX 作用&#xff1a;实现组件通用属性的渐变过渡效果&#xff0c;提升用户体验。支持属性&#xff1a;width、height、backgroundColor、opacity、scale、rotate、translate等。注意事项&#xff1a; 布局类属性&#xff08;如宽高&#xff09;变化时&#…...

.Net Framework 4/C# 关键字(非常用,持续更新...)

一、is 关键字 is 关键字用于检查对象是否于给定类型兼容,如果兼容将返回 true,如果不兼容则返回 false,在进行类型转换前,可以先使用 is 关键字判断对象是否与指定类型兼容,如果兼容才进行转换,这样的转换是安全的。 例如有:首先创建一个字符串对象,然后将字符串对象隐…...

Linux --进程控制

本文从以下五个方面来初步认识进程控制&#xff1a; 目录 进程创建 进程终止 进程等待 进程替换 模拟实现一个微型shell 进程创建 在Linux系统中我们可以在一个进程使用系统调用fork()来创建子进程&#xff0c;创建出来的进程就是子进程&#xff0c;原来的进程为父进程。…...

Angular微前端架构:Module Federation + ngx-build-plus (Webpack)

以下是一个完整的 Angular 微前端示例&#xff0c;其中使用的是 Module Federation 和 npx-build-plus 实现了主应用&#xff08;Shell&#xff09;与子应用&#xff08;Remote&#xff09;的集成。 &#x1f6e0;️ 项目结构 angular-mf/ ├── shell-app/ # 主应用&…...

面向无人机海岸带生态系统监测的语义分割基准数据集

描述&#xff1a;海岸带生态系统的监测是维护生态平衡和可持续发展的重要任务。语义分割技术在遥感影像中的应用为海岸带生态系统的精准监测提供了有效手段。然而&#xff0c;目前该领域仍面临一个挑战&#xff0c;即缺乏公开的专门面向海岸带生态系统的语义分割基准数据集。受…...

push [特殊字符] present

push &#x1f19a; present 前言present和dismiss特点代码演示 push和pop特点代码演示 前言 在 iOS 开发中&#xff0c;push 和 present 是两种不同的视图控制器切换方式&#xff0c;它们有着显著的区别。 present和dismiss 特点 在当前控制器上方新建视图层级需要手动调用…...

9-Oracle 23 ai Vector Search 特性 知识准备

很多小伙伴是不是参加了 免费认证课程&#xff08;限时至2025/5/15&#xff09; Oracle AI Vector Search 1Z0-184-25考试&#xff0c;都顺利拿到certified了没。 各行各业的AI 大模型的到来&#xff0c;传统的数据库中的SQL还能不能打&#xff0c;结构化和非结构的话数据如何和…...