HTML Select & Textarea Elements

Select Dropdown

The <select> element creates a dropdown menu. Each item in the menu is defined with an <option> tag.

<label for="country">Choose your country:</label>
<select id="country" name="country">
  <option value="india">India</option>
  <option value="usa">USA</option>
  <option value="uk">UK</option>
</select>
            

Always use the label element with a for attribute pointing to the id of the select for accessibility.

Textarea

The <textarea> element is used for multiline text input. It is ideal for comments, messages, or descriptions.

<label for="message">Your Message:</label><br>
<textarea id="message" name="message" rows="4" cols="50">
Enter your message here...
</textarea>
            

You can control the size of the textarea using the rows and cols attributes or CSS.

Best Practices

• Always associate <label> with form elements for better usability.
• Use placeholder text in textarea for guidance, but never as a replacement for labels.
• Use the selected attribute in <option> to preselect a value.