console 命令行工具 X clear

console

<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>登录</title>
	<link type="test/css" href="css/test.css" rel="stylesheet">
</head>

<body>
	<form action="#" method="post">
		<div class="form-control">
			<label for="username">账号：</label>
            <input type="text" id="username" name="username" class="number" pattern="">
        </div>
        <div class="form-control">
            <label for="password">密码：</label>
            <input type="password" id="password" name="password" class="password">
        </div>
        
        <button class="loginbtn" >登录</button>
              
        
            
            


    </form>
            


</body>


</html>

*{
    padding: 0;
    margin: 0;
    border: 0;
}
body{
    font-size: 18px;
    font-family: "黑体";
    background-color: green;
    color: #FFF;
}
form{
    width: 420px;
    height: 200px;
    padding-top: 60px;
    margin: 250px;
    background: rgb(255, 255, 255, 0.1);
    border-radius: 1px solid rgba(255, 255, 255, 0.3);
}
.form-control{
    margin-top: 15px;
    text-align: center;
}
.number,.password{
    width: 165px;
    height: 18px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    padding: 2px 2px 2px 22px;
    border-radius: 5px;
    color: #FFF;    
}
.number{
    background: url() no-repeat 5px center rgba(255, 255, 255, 0.1);
}

.password{
    background: url() no-repeat 5px center rgba(255, 255, 255, 0.3);
}

.loginbtn{
    width: 193px;
    height: 28px;
    border-radius: 6px;
    border: 10px solid #000;
    margin-left: 45px;
    background: #2d77bd;
    color: #FFF;
    border: none;
    margin-top: 10px;
}