BitWithBite
HTML Worksheet
🌐 Select & Textarea
SCORE___ / 20
NameClassDate
After this worksheet you can
Dropdowns with select/optionGroup options with optgroupMulti-line text with textareaPreselect and size options📚 Quick Recap
Not every form field is a text box. <select> gives users a dropdown of pre-defined options — or a multi-select list. <textarea> gives them a resizable multi-line text area for longer input. And <datalist> adds autocomplete suggestions to any text input. Together, these three elements cover almost every remaining form use case.
🧠 Section A · Concept Check ● BEGINNER 4 × 1 = 4
1A dropdown uses:
2Each choice is an:
3Long answers use:
4Preselect an option with:
🧮 Section B · Problem Solving ● INTERMEDIATE 2 + 3×3 = 11
5< label="Asia"> groups options.
6textarea size: rows and .
7Country dropdown with 3 options.
8Comment box 5 rows tall.
9select vs radios - when which?
🚀 Section C · Challenge ● CHALLENGE 5
10How do you set default textarea text?
💭 Reflection — the most useful thing I learned:
A ___/4 B ___/11 C ___/5 Total ___/20
Teacher's Signature
Parent's Signature
✂ answer key — fold or cut before handing out
1-A 2-A 3-A 4-A | 5 optgroup 6 cols 7 = <select name="c"><option>PK</option><option>UK</option><option>US</option></select> 8 = <textarea rows="5" cols="40"></textarea> 9 = Few options = radios (visible); many = select (compact) | 10 = Put it between the opening and closing tags