BitWithBite
HTML Worksheet
🌐 Form Basics
SCORE___ / 20
NameClassDate
After this worksheet you can
Build forms with form/inputLabel every fieldSubmit with buttonsKnow action and method📚 Quick Recap
Forms are how users talk back to websites — searches, logins, registrations, checkout flows. Every form is built from the same foundation: a <form> wrapper that defines where data goes, labels and inputs that collect it, and a submit button that sends it. Master these basics and every form you'll ever build becomes a variation.
🧠 Section A · Concept Check ● BEGINNER 4 × 1 = 4
1Forms are wrapped in:
2Text is typed into:
3Labels connect to inputs via:
4Where data is sent is set by:
🧮 Section B · Problem Solving ● INTERMEDIATE 2 + 3×3 = 11
5method="" hides data from the URL.
6method="" puts data in the URL.
7Write a labelled email field.
8Why is name= required on inputs?
9GET vs POST in one line?
🚀 Section C · Challenge ● CHALLENGE 5
10Why click-focus matters: what do labels give you?
💭 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 POST 6 GET 7 = <label for="e">Email</label><input type="email" id="e" name="email"> 8 = Without it the field's value is not submitted 9 = GET = in URL, bookmarkable; POST = in body, for sensitive/large data | 10 = Clicking the label focuses the field - bigger touch target + accessibility