Python Textareas & Select Dropdowns (<textarea>, <select>)
When single-line inputs aren't enough, HTML gives you <textarea> for multi-line essays/comments and <select> with <option> tags for drop-down menus.
"<input type="text"> is a single line on an index card. <textarea> is an entire blank notebook page. <select> is a restaurant menu where you pick one entree from a dropdown list."
Deep Dive: How It Works
<textarea rows="4" cols="50">: Multi-line text box. Unlike <input>, <textarea> requires a closing </textarea> tag!
Initial content in textarea: Any text placed between <textarea>Default text</textarea> becomes the starting content.
<select name="country">: The dropdown container.
<option value="us">United States</option>: The individual selectable options.
selected attribute: Add <option value="py" selected> to set the default selected dropdown option.
Syntax Blueprint
<select name="role"> <option value="dev">Developer</option> <option value="des">Designer</option> </select> <textarea rows="4" placeholder="Your message..."></textarea>
Select menu with options and multi-line textarea container.
Core Rules to Remember
Common Beginner Traps & How to Fix Them
Putting placeholder inside textarea contentWhy it happens: Writing <textarea>Type here</textarea> treats "Type here" as real user text that they have to backspace.
How to fix: Use the placeholder="Type here" attribute and leave the tag interior empty: <textarea placeholder="Type here"></textarea>.
Live Interactive Example
Hit Run Code to see it liveYour Turn: Micro Challenge
No pressure! Edit the starter code below and test your solution with instant feedback.
Build a dropdown menu with two options
- Create a <select name="theme"> containing two <option> items: "Dark" and "Light"
Finished reading and practicing?
Mark this lesson as completed to update your course progress.