HTMLCSS js简单登录跳转界面实现验证码功能

hu9529

于 2020-07-14 13:53:59 发布

阅读量4.7k

点赞数

分类专栏： web 文章标签： css html js

本文链接：https://blog.csdn.net/a_zhao_ya/article/details/107336342

版权

这是一个使用HTML、CSS和JavaScript实现的简单登录界面教程，包括了验证码功能的集成。用户需要创建一个login.html文件，并通过CSS设置背景、元素样式，JavaScript处理表单验证和页面跳转。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

、、、
//HTMLCSS js简单登录跳转界面实现验证码功能
还需要在创建一个login.html文件放在于index.html文件同项目下。
css部分：* {
margin: 0;
padding: 0;
}
html {
height: 100%;
}
body {
height: 100%;
}
.div1 {
height: 100%;
background-image: linear-gradient(to right, #30cfd0, #330867);
}
.div2 {
width: 300px;
height: 400px;
background-color: white;
position: relative;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
border-radius: 10px;
padding: 0 50px;
}
.div3 {
font-size: 25px;
text-align: center;
line-height: 100px;
color: black;
font-weight: bold;
}
.div4 .inp1{
display: inline-block;
width: 85%;
border: 0;
border-bottom: 1px solid #ccc;
padding: 10px 0 10px 10px;
margin-bottom: 20px;
outline: none;
bac