html实现一个好看的登录界面

最新推荐文章于 2024-06-11 11:30:38 发布

小任性嘛

最新推荐文章于 2024-06-11 11:30:38 发布

阅读量8.4k

点赞数 7

本文链接：https://blog.csdn.net/weixin_43728903/article/details/103948452

版权

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>登录</title>
</head>
<style>
    body{
        background-image: url("bg.jpg");
        background-repeat: no-repeat;
    }
</style>
<body>
<img src="bg.jpg" style="width:100%;height:100%;position:relative">
<div align="center"  width="200px" height="200px" style="font-size: 15px;background-color: lightsteelblue;
        border: 1px;color: #cc0000;position:absolute;left:35%;top:23%;right: 35%;bottom: 15%;border-style: double">
       <form name="form1" action="" method="post" style="position: absolute;top: 22%;left: 15%">
               <input name="name" type="text" size="50" style="height: 40px" placeholder="请输入用户名："><br><br>
               <input name="name" type="text" size="50" style="height: 40px" placeholder="请输入密码："><br><br>
               <input name="name" type="text" size="50" style="height: 40px" placeholder="请输入验证码："><br><br>
               <input type="button" value="登录" style="width: 320px;height: 40px;color: white;
               background-color: #cc0000"><br><br>
              <input type="radio">记住密码&nbsp;&nbsp;&nbsp;&nbsp;
              <a href="" style="text-decoration: none">去注册</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
           <a href="" style="text-decoration: none">忘记密码</a>
       </form>
   </div>
</body>
</html>

背景图片：
在这里插入图片描述

小任性嘛

关注

7
点赞
踩
69

收藏

觉得还不错? 一键收藏
2
评论
html实现一个好看的登录界面

<%@ page contentType="text/html;charset=UTF-8" language="java" %><html><head> <title>登录</title></head><style> body{ background-image: url(...
复制链接

扫一扫