<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Input Types</title>
</head>
<body>
  <h1>Input Types</h1>
    <form action="">
     <!-- button -->
     <span>Button:-</span>
       <input type="button" onclick="alert('Hello World!')" value="Click Me">
     <br><br>
       <!-- checkbox -->
       <span>Checkbox:-</span>
    <input type="checkbox" name="" id="">
    <label for="">HTML</label>
    <input type="checkbox" name="" id="">
    <label for="">CSS</label>
    <input type="checkbox" name="" id="">
    <label for="">JS</label>

    <br><br>
    <!-- Color -->
    <span>Color:-</span>
    <input type="color" name="" id="">
    <br><br>
    <!-- Date -->
     <span>Date:-</span>
     <input type="date" name="" id="">
     <br><br>
     <!-- Email -->
     <span>Email:-</span>
     <input type="email" name="" id="">
     <br><br>
     <!-- File -->
     <span>File:-</span>
     <input type="file" name="" id="">
     <br><br>
     <!-- Hidden -->
     <span>Hidden:-</span>
     <input type="hidden" name="">
     <br><br>
     <!-- Password -->
     <span>Password:-</span>
     <input type="password" name="" id="">
     <br><br>
     <!-- Radio -->
     <span>Radio:-</span>
     <input type="radio" name="" id="">Female
     <input type="radio" name="" id="">Male
     <br><br>
     <!-- Reset -->
     <span>Reset:-</span>
     <input type="reset" value="Reset">
     <br><br>
     <!-- Range -->
     <span>Range:-</span>
     <input type="range" name="" id="" min="0" max="50">
     <br><br>
     <!-- Image -->
     <span>Image:-</span>
     <input type="image" src="img.gif" alt="">
     <br><br>
     <!-- Submit -->
     <span>Submit:-</span>
     <input type="submit" value="Submit">
     <br><br>
     <!-- Text -->
     <spa
     n>Text:-</span>
     <input type="text" name="" id="">
     <br><br>
     <!-- Time -->
     <span>Time:-</span>
     <input type="time" name="" id="">
     <br><br>
     <!-- Select Option -->
     <select name="" id="">
       <option value="1">HTML</option>
       <option value="2">CSS</option>
       <option value="3">JS</option>
       <option value="4">React</option>
      </select>
      <br><br>
      <!-- textarea -->
      <textarea name="" id="" cols="30" rows="10">Address</textarea>
      <!-- date -->
      <input type="date" name="" id="">







    </form>
</body>
</html>

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.