How To Create A Login And Forget Password Form Using HTML And CSS.

We are going to create something like this at the end of our coding.

If we start with the login  part;we are going to start by creating a form which asks for User_name and password. We what if the password is wrong, the system asks the user to forget password. So,if the password is wrong,the computer asks the user to create a new password. The coding goes;

<div id="login">

<form action="action-page.php" autocomplete="on">

<p>

<label for="name">User name</label>

<input type="text" name="txtname" id="txtname">

</p>

<p>

<label for="pass">password</label>

<input type="text" name="txtpass" id="txtpassword">

</p>

<p>

<button onclick="myFunction()" type="button"

class="sent"> sent</button>

</p>

</form>

</div>

<div class="container">

<h1>Creating New Password</h1>

<h2>Please Enter Your:</h2>

<hr>

<label for="email"><b>User Name</b></label>

<input type="text" placeholder="Enter Email"

name="email" required>

<label for="psw"><b>New Password</b></label>

<input type="password" placeholder="Enter Password"

id="psw" name="psw" required>

<label for="psw-repeat"><b>Confirm Password</b></label>

<input type="password" placeholder="Repeat Password" id="psw"

name="psw-repeat" required>

<label>

<input type="checkbox" check ="checked" name="remember"

style="margin-bottom:15px"> Remember me

</label>