login form with background image in html. code example

Example: login form with background image in html

<!--html here -->
<div class="bg-img">
  <form action="/login" class="container" method="post" >
    <h1>Login</h1>

    <label for="email"><b>Email</b></label>
    <input type="text" placeholder="Enter Email" name="email" required>

    <label for="psw"><b>Password</b></label>
    <input type="password" placeholder="Enter Password" name="psw" required>

    <button type="submit" class="btn">Login</button>
  </form>
</div>

<!-- CSS Adding bg image -->
<style>
.bg-img {
  /* The image used */
  background-image: url("img_nature.jpg");

  /* Control the height of the image */
  min-height: 380px;

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  
}
  </style>