<html>
<head>
<title>
Login
</title>
<link href="index.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="warper">
<div class="head">
<div class="login">
<img src="lgn.png">
</div>
</div>
<div class="login_as">
<br>
<div class="user_name">
<div class="text">
<br>
<strong>User name</strong> <input type="text" name="text">
<br>
<br>
<strong>Passcode</strong> <input type="text" name="text">
</div>
</div>
<div class="text1">
<br>
<div class="log">
<strong>Log in as</strong></div>
<input type="radio" name="admin"><strong>Admin</strong><br>
<br>
<input type="radio" name="admin"><strong>Worker</strong>
<br>
<div class="button">
<input type="button" value="Forget pass" name="forget"></div>
<div class="button">
<input type="button" value="Sign Up" name="signup" >
</div>
<div class="button">
<input type="button" value="Login" name="login" >
</div>
</div>
</div>
</div>
</body>
</html>
Css File
.warper{
background-color:#DCDCDC;
height:600px;
width:400px;
margin-left:300px;
margin-top:50px;
border:1px solid #FF6633;
}
.head{
background-color:#F0F0F0;
border:1px solid #F0F0F0;
box-shadow: 0px 0px 5px;
width:395px;
height:140px;
margin-left:2px;
margin-top:3px;
}
.login{
margin-left:100px;
margin-top:50px;
}
.login_as{
background-color:#F0F0F0;
height:360px;
width:350px;
margin-top:30px;
margin-left:25px;
box-shadow: 0px 0px 5px;
}
.user_name{
background-color:#F0F0F0;
height:120px;
width:300px;
margin-left:25px;
margin-top:30px;
box-shadow: 0px 0px 5px;
}
.text{
text-align:center;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
margin-top:20px;
}
.text1{
text-align:center;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
margin-top:30px;
margin-left:50px;
}
.log{
float:left;
margin-left:30px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
margin-top:20px;
}
.text2{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
margin-top:50px;
}
.button{
float:left;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
margin-top:60px;
margin-left:0px;
box-shadow: 0px 0px 5px;
}
.verticalLine {
border-left: thick solid #ff0000;
}
.horizentalLine {
margin-top:50px;
border-left: thick solid #ff0000;
}
No comments:
Post a Comment