如何用HTML写一个最简单的登录界面？

发布网友发布时间：2022-04-22 02:12

共1个回答

热心网友时间：2023-06-15 17:18

灞曞紑鍏ㄩ儴<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link href="main.css" type="text/css" rel="stylesheet">
<title>鐧婚檰鐣岄潰</title>
</head>

<body>
<div class="login_ico">
<img src="images/login_ico.png">
</div>
<div class="login_putin">
<ul>
<li><input type="text" ></li>
<li><input type="password" ></li>
</ul>
</div>
<div class="login_btn">
<input type="submit" value="鐧婚檰">
</div>
</body>
</html>
鏍峰紡锛?br />
*{
margin:0;
padding:0;}

li{
list-style-type:none;
margin:0;
padding:0;}
a{
text-decoration:none;
color:#000;}

/*---------------------鎸夐挳-----------------------------*/
.login_putin ul li input{
margin: 0;
width:70%;
padding: 1em 2em 1em 5.4em;
-webkit-border-radius:.3em;
-moz-border-radius: .3em;
border: 1px solid #999;
}

.login_btn{
width:300px;
margin:40px auto 0 auto;
}

.login_btn input{
width:100%;
margin:0;
padding:.5em 0;
-webkit-border-radius:.3em;
-moz-border-radius: .3em;
border:#1263be solid 1px;
background:#1b85fd;
color:#FFF;
font-size:17px;
font-weight:bolder;
letter-spacing:1em;
}

.login_btn input:hover{
background:#1263be;
}