登录界面
代码块
<html>
<head>
<meta></meta>
<title>登录界面</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
body{ color:white}
.context{
background:#50A3A2;
position:absolute;
left:0;
top:50%;
width:100%;
height:400px;
margin:-200px;
overflow:hidden;/*隐藏滚动条*/
}
.container{
max-width:600px;
height:400px;
padding:80px 0;/*上下 左右*/
/*background:#666;*/
margin:0 auto:0;/*居中显示*/
}
.container,h1{
font-size:40px;
font-weight:300;
}
form{
padding:20px 0;
}
form input{
border:1px solid #FFF;
width:220px;
padding:10ox 15px;
display:block;
margin:0 auto 10px auto;
border-radius:30px:/*圆角框*/
font-size:18px;
font-weight:300;
}
form button{
background:white;
border:0;
padding:10px 15px;
color:green;
border-radius:3px:
width:250px;
font-size:16px;
}
form button{
background:#CCC; /*鼠标移至此处时变色*/
}
</head>
</style>
<body>
<div class="context">
<div class="container">
<h1>Welcome</h1>
<form action="" method="get">
<input type="text" name="userId" placeolder="请输入账号"/>
<input type="password" name="userpw" placeolder="请输入密码"/>
<button type="submit">登 陆</button>
</form>
</body>
</html>
878
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
