• in
InterCourses
CoursesBlogs
0
← Introduction to HTML
○What Is HTML? See Tags in Action○Exercise: Build the Meridian Signal○Complete HTML5 Page Structure: See It in Action○Exercise: Build a Complete HTML5 Page✦Module Quiz
○Heading Hierarchy Demo: H1 and H2○Exercise: Extend the Signal Brief○Paragraphs and Inline Tags Demo○Exercise: Write Meridian's Survey Notes○List Types Demo: Steps, Items, and Terms○Exercise: Build a Crew member Loadout○Challenge: Transmit a Rescue Signal✦Module Quiz
○Hyperlinks○Images○Applying Styles to HTML✦Module Quiz
○Div and Span○HTML Tables○Classes and IDs○Review: Structured Profile✦Module Quiz
○Project 1 - Visiting Card Structure○Project 1 - Visiting Card Actions✦Module Quiz
○The Head Element and Page Title○Meta Tags○HTML Entities✦Module Quiz
○Form Basics Demo: Join the Meridian Relay○Exercise: Build a Night-Shift Check-In○Input Types Demo: Build a Mission Profile●Exercise: Record Beacon Maintenance○Choice Controls Demo: Select Training Modes○Exercise: Plan a Supply Pickup○Response Controls Demo: Send a Mission Reply○Exercise: Build a Rescue Dispatch Report○Challenge: Send an Emergency Beacon✦Module Quiz
○Project 2 - Contact Us Form Structure○Project 2 - Contact Us Form Actions✦Module Quiz
○Embedding Video○Embedding Audio○Iframes✦Module Quiz
○Semantic HTML Tags○Details, Figure, and Figcaption✦Module Quiz
○Project 3 - Resume Semantic Structure○Project 3 - Resume Links and Actions✦Module Quiz

Exercise: Record Beacon Maintenance

Mission

After exploring the mission-profile demo, the crew needs a beacon maintenance record. Each detail needs a control suited to its value.

What you'll build

A maintenance record with technician name, email, battery level, service date, beacon color, and a submit button.

Your Task

  1. Add one text input for the technician’s name.
  2. Add one email input for a backup email.
  3. Add one number input with min and max values for battery level.
  4. Add one date input for the service date.
  5. Add one color input for the beacon light.
  6. Add a submit button to save the maintenance record.

Checkpoint

Run the page. The number field should use numeric controls, the date field should offer a picker in supporting browsers, and the color field should open a color picker.

Payoff

The maintenance record now gives the browser enough information to choose a useful control for each answer.

Hint 1
1 / 1
HINT 1

The type attribute controls the browser UI.

Loading editor…
READY
intercourses
html