How To Make a simple Login Form

How To Make a simple Login Form

Thanks to everyone. Today I will show you how to create a simply login form. HTML CSS has been built to use this login feature. 

HTML

<div class="container">
<h2>Login Form</h2>
<div class="row">

<form action="/">
<label for="">Username</label>
<input type="text" name="" value="" placeholder="Username" required>

<label for="">Password</label>
<input type="password" name="" value="" placeholder="******" required>
<input type="submit" name="" value="Login">
</form>
</div>
</div>

CSS

*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body{
  background-color: #222;
}
.container{
  width: 40%;
  margin: 100px auto;
  background-color: #fff;
  border: 1px solid #ddd;
}
.row{
  padding: 10px;
}
h2{
  color: rgba(0,140,200,1);
  padding: 20px;
  font-weight: bold;
  position: relative;
  margin-bottom: 10px;
}
h2:before{
  content: '';
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  height: 1px;
  background-color: rgba(0,140,200,1);
}
.row label{
  width: 100%;
  color: rgba(0,140,200,1);
  text-transform: uppercase;
}
.row input{
  width: 100%;
  padding: 10px;
  margin: 10px 0 10px 0;
  border-top: none;
  border-left: none;
  border-right: none;
  border-bottom-color: rgba(0,140,200,.2);
  outline: none;
}
.row input:focus{
  background-color: rgba(0,140,200,.2);
}
.row input[type="submit"]{
  border: none;
  color: rgba(0,140,200,1);
  font-size: 1rem;
  font-weight: bold;
  text-transform: uppercase;
}