Sign in Page in HTML | Login page in HTML with validation

For making a sign in page in HTML from HTML elements are used Text field is used to accept username and password text field is used to accept a password from the user. The log in button is used for submitting data to the server for validation. The reset button is used for erasing the username and password text field value.

sign in page using html and css
Log in Page in HTML

Login page in HTML with validation


Login Page in HTML to Create the Structure of the Page Layout.


<!DOCTYPE html>
<title>Sign In</title>
<link rel="stylesheet" type="text/css" href="style.css">
<div id="signin">
<form method="get" action="">
<table border="2">
<tr><th colspan="2">SIGN IN</th></tr>
<tr><td>User name:</td><td><input type="text" name="un"></td>
<tr><td>Password:</td><td><input type="password" name="pwd">

<tr><td><input type="reset" name="Reset"></td>
<td><input type="submit" value="Log in"></td>



CSS Page for Designing the Login Page


background-color: skyblue;
border: 4px solid blue;
border-collapse: collapse;
height: 50px;
width: 100px;
text-align: center;
color: black;
th:nth-child(odd){background-color: slateblue;}
th:nth-child(even){background-color: yellow;}
tr:nth-child(odd){background-color: yellow;}
tr:nth-child(even){background-color: yellow;}

Post a Comment