Project 16: Login Screen

HTML Masterclass

Builds on these lessons

Input Password Sec Xss Basics Sec Escaping Html Sec Safe External Links Sec Noopener Noreferrer Sec Csp Sec Iframe Sandbox

Step 1 of 4

Project

Username & Password Fields

Add an email field for the username and an <input type="password">. type="password" only masks the characters visually as the user types — it does nothing to encrypt the value in transit, that protection comes from serving the page over HTTPS.

🎯 Your Task

Please add the exact code shown in the light gray box below to your editor.Do not delete your previous code, just insert these new lines in the correct place!

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Log In | Nimbus Labs</title>
</head>
<body>
  <h1>Log In</h1>
  <form action="/login" method="POST">
    <label for="email">Email</label>
    <input type="email" id="email" name="email" required>
    <label for="password">Password</label>
    <input type="password" id="password" name="password" required>
    <button type="submit">Log In</button>
  </form>
</body>
</html>

← Previous Next →