HTML 登录页面

最新推荐文章于 2024-06-19 23:33:54 发布

云朵儿的媛码

最新推荐文章于 2024-06-19 23:33:54 发布

阅读量575

点赞数 4

分类专栏：硅步致远文章标签： HTML DIV CSS 登录页

本文链接：https://blog.csdn.net/qq_38889321/article/details/103683388

版权

硅步致远专栏收录该内容

9 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>登录</title>
    <style type="text/css">
        body {
            background-image: url(/image/bg.png);
            background-repeat:no-repeat;
            text-align: center;
        }
        .btn {
                background-color:rgb(83, 123, 53);
                color: white;
                border: 0px;
                width: 80px;
                margin:15px;
                height: 22px;
                align-content: center;
            }
        #userName,#password {
                width: 200px;
                height: 18px;
                margin: 5px;
                border: rgb(83, 123, 53) 1px solid;
            }
        form {
            border: transparent 2px;
            padding:60px 30px 30px 30px;
            width: 250px;
            height: 200px;
            background-color: rgb(0, 0, 0);
            align-content: center;
            text-align: center;
            opacity: 0.6;
            color: white;
            margin:260px 260px 260px 300px;
            }
        </style>
        <script>
            function NotNull() {
                var userName=document.getElementById("userName");
                var password=document.getElementById("password");
                if(userName.value=="")
                {
                  alert("用户名不得为空！");
                  return false;
                }
                if(password.value=="")
                {
                    alert("密码不得为空！");
                    return false;
                }else
                {
                    return true;
                }
            }
        </script>
</head>
<body>
    <div>
        <a href="Index.html">主页</a>
        <form  action="HomePage.html" method="post" onsubmit="return NotNull();">
            <label for="userName">登录</label>
            <br/>
            <br/>
            <input id="userName" name="userName" type="text" placeholder="用户名"/>
            <br/>
            <input id="password" name="password" type="password" placeholder="密码"/>
            <br/>
            <input class="btn" type="submit"  value="登录" />
            <input class="btn" type="reset" value="重置" />
        </form> 
    </div>
</body>
</html>

云朵儿的媛码

关注

4
点赞
踩
3

收藏

觉得还不错? 一键收藏
2
评论
HTML 登录页面

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="...
复制链接

扫一扫

专栏目录