Friday, July 26, 2024

HTML Form Elements

 

HTML form elements are used to capture user input in various ways within a form. Common elements include <input> for text fields, checkboxes, and radio buttons, <textarea> for multi-line text input, <select> for drop-down lists, and <button> for clickable buttons. Each element has attributes such as name, type, value, and placeholder to specify its behavior and appearance. Proper use of form elements is essential for creating interactive and user-friendly forms.

Examples:

<form>

      <input type="text" name="username" placeholder="Enter your username">

      <input type="password" name="password" placeholder="Enter your password">

      <textarea name="message" rows="4" cols="50">Enter your message here...</textarea>

      <select name="options">

        <option value="option1">Option 1</option>

        <option value="option2">Option 2</option>

      </select>

      <button type="submit">Submit</button>

   </form>


HTML Code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HTML Tutorial</title>
</head>
<body>
    <h1>HTML Form Elements</h1>
    <p>Form elements include input types like text, password, radio, checkbox, etc.</p>
    <form>

      <input type="text" name="username" placeholder="Enter your username">

      <input type="password" name="password" placeholder="Enter your password">

      <textarea name="message" rows="4" cols="50">Enter your message here...</textarea>

      <select name="options">

        <option value="option1">Option 1</option>

        <option value="option2">Option 2</option>

      </select>

      <button type="submit">Submit</button>

   </form>


</body>
</html>

The Output of the above code:


HTML Tutorial

HTML Form Elements

Form elements include input types like text, password, radio, checkbox, etc.