Creative Login Template design and Source Code
Source Code 👇👽
html...
<div class = "center" >
<form action="login" method="post">
<div align = "center" >
<br><br>
<h1 align = "center"> Get Started </h1> <br>
<input type="text" name="username" placeholder="Username" required> <br> <br><br>
<input type="password" name="password" placeholder="Password" required> <br><br><br>
<a href = "forgotpassword.jsp" class = "text2"> <i> <b> Forgot Password ? </b> </i> </a> <br> <br>
<input type="submit" name="submit" value="Login" > <br>
<p class="text"> <b> Not Account Yet ? <br> <br><span> <a href="customerinsert.jsp" class="text1"> Register </a> </span> </b> <p>
</div>
</form>
</div>
css...
.center {
box-shadow:0 5px 30px black;
width:500px;
height:550px;
background-color:rgba(200 , 200 , 200 , 0.5);
color:#000137;
top:125%;
left:50%;
position:absolute;
transform:translate(-50% , -50%);
box-sizing:border-box;
}
input[type = "text"] , [type = "password"]
{
width : 50% ;
padding: 7px ;
float:center;
font-size:15px;
border:2px solid;
border-radius:16px;
text-align: center;
border-style:none;
font-famity:calibri;
backgrount-color:transparent;
color:black;
}
input[type = "submit"] {
background-color: #070b24;
color: white;
padding: 10px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
font-size:16px;
border-radius:12px;
width: 30%;
font-weight:bold;
}
.text {
font-size:21px;
color:black;
display:inline-block;
}
.text1 {
font-size:20px;
color:#02023f;
}
.text2{
font-size:20px;
color:#02023f;
}
a{
text-decoration:none;
color:#070b24;
font-size:1px;
padding: 0px 3px;
}
Comments
Post a Comment