HTML+css的用户登录界面

HTML是常用的前端语言，前端语言的更新大概18个月为一个周期，这是我自己做的登录页面。

<html>
    <head>
    <meta charset="utf-8">
    <title>登录注册页</title>
    <style> 
        body{
            margin: 0;/**/
        }
        /*CSS样式*/
        .box{
            width: 100%;
            height: 60%;
            background: url("dlbg.jpg") center;/*背景图片* center 居中*/
        }

        .login{
            float:right;
            width: 280px;
            height: 300px;
            background: rgb(237, 236, 241);
            margin: 40px 50px 0 0;/*上 右 下 左*/
        }
        .top{
            text-align: center;
        }
        .RHS_user,.RHS_pwd,.RHS_Type{
            width: 200px;
            height: 40px;
            text-indent: 50px;
            margin-top: 20px;
            border: slateblue slateblue;
            border-radius:10px;
        }
        .RHS_user{
            background: url("zhanghao.jpg") no-repeat;
        }
        .RHS_pwd{
            background: url("mima.jpg") no-repeat;
        }
        .RHS_Type{
            background-color: rgba(228, 222, 222, 0.712);
        }
        .RHS_submit{
            margin-left: 50px;
            background:url("but.jpg") center;
        }
        .RHS_submit1{
            background-color:rgb(36, 15, 224);
        }
        .RHS_submit,.RHS_submit1{
            width: 80px;
            height: 40px;
            margin-top: 20px;
        }

    </style>
    </head>
    <body>
         <div class="box">
             <div class="login"> 
                 <div class="top">
                    <form action="">
                        <input name="rebhuasheng_user" type="text"  class="RHS_user"  placeholder="请输入用户名">
                        <select name="renhuasheng_usertype" class="RHS_Type">
                            <option>请输入用户类型</option>
                            <option>普通用户</option>
                            <option>管理员</option>
                        </select>
                        <input name="renhuasheng_pwd" type="password" class="RHS_pwd" placeholder="请输入密码">
                        <table >
                            <tr>
                            <td><input type="submit" class="RHS_submit" value="" ></td>
                            <td><input type="submit" class="RHS_submit1" value="注   册" ></td>
                            </tr>
                        </table>
                    </form>
                 </div>               
            </div>
         </div>
    </body>
</html>

运行结果：正在上传…重新上传取消

正在上传…

重新上传

取消

原文链接：https://blog.csdn.net/qq_45988058/article/details/106392094