How to create login page in html ?

Hi Friendz

Today I will create a html login page

Copy this code and paste it to notepad, than go to

File>Save As

Give it a name that ends with .html extantion and save it

How open this html file.

And you get a login screen


<html >
<head>
<title>XLAR8</title>

<style>
/*css*/
body {
background-color:#172035;
}

#log_in{
border:solid aqua;
border-radius:10px;
text-align:center;
margin-top:100px;
margin-left:100px;
width:50%;
height:250px;

}
#log_in ,h1{
color:white;
}
#log_in input{
border-style:hidden hidden solid hidden;
background-color:#172035;
border-color:aqua;
color:white;
margin-top:10px;
width:15%;
-webkit-transition:width 2s;
transition: width 2s;
}
#log_in input:hover{
width:85%;
}
#log_in button{
border:solid black;
color:white;
background-color:black;
border-radius:10px;
margin-top:15px;
-webkit-transition:background-color 2s;
transition:background-color 2s;

}
#log_in button:hover{
background-color:blue;
}

</style>
</head>
<body>

<div id="log_in">
<h2>log in :</h2>
<br />
<input type="email" placeholder="example@e-mail.com"/>
<br />
<input type="password" placeholder="password"/>
<br />
<input type="number" placeholder="number"/>
<br />
<button>log in </button>

</div>

</font>

<font size=5>



<a href="xlar8.blogspot.com/ ">
XLAR8 : All </a><br>

<a href="https://chat.whatsapp.com/H0Gsgryv2AE2Yrsn8eof02">join our whatsapp group</a><br>

<a href="https://xlar8.blogspot.com/">Wabsite </a><br><br>

</font>


<marquee><h1>Like And Subcribe Us  </h1></marqee>


</body>
</html>






Enjoy! Follow us for more... 

1 comment:

  1. In need of a log in form that redirects me to another page and submit form content to my email at the same time

    ReplyDelete

How to Install files and the database in MAMP Server.mp4

  Download now   Enjoy! Follow us for more...