HTML / INTERACTIVE PRACTICE
Structure a study plan
Turn plain text into headings, paragraphs, and a list.
Why this practice comes now
You have learned headings, lists, and semantic regions. Combine them to turn unstructured notes into a readable study plan.
Concepts to recall
- Main content — Use main for the page’s central content.
- Headings and paragraphs — Use heading levels to describe sections, and p for sentences.
- List structure — A ul groups related li items.
Start with one action
Look at the starter in the live preview. In the HTML editor, give the line that names the whole plan a main-heading tag. The preview updates as you type. Only HTML is needed; the styling is supplied.
Your mission
Replace the plain text with meaningful HTML. Work inside the body only: the preview supplies the rest of the document. Your wording can be different from the target.
- Put the content inside one main element.
- Add one main heading and a paragraph introducing your plan.
- Add a Materials section heading and an unordered list with at least two nonempty items.
Your code and completion are saved in this browser. Pass all solution checks to complete this practice in My progress. Editing or resetting code keeps your completion.
- Tab / Shift+Tab: indent / outdent.
- Escape, then Tab or Shift+Tab: leave the editor.
- Enter: keep indentation.
Drag the divider, or focus it and use arrow keys to resize. Enter restores an even split.
Up to 10,000 characters per editor.
These controls resize both your preview and the target. Checks always test both widths. Scroll within a preview to inspect the full layout.
Preview supports text, headings, and layout elements with classes. Scripts, links, forms, and external resources are disabled.
Optional: save a copy of your HTML with the supplied styling. You only need to edit index.html; no CSS or JavaScript knowledge is required. How to run it on your computer →
Stuck? Open one hint at a time, try a change, and check again before opening the next. The complete answer stays in the separate explained solution.
Hint 1
Think about which element identifies the main content of a page.
Hint 2
Locate the title, introductory sentence, and Materials label. Which should be h1, p, and a subsection heading?
Hint 3
Group the materials in one ul, with an li around each item. Check that both items are inside the list and all content is inside main.
See the explained solution
<main>
<h1>My study plan</h1>
<p>A little practice each day.</p>
<h2>Materials</h2>
<ul>
<li>Notebook</li>
<li>Computer</li>
</ul>
</main>The main element groups the page content. The h1 introduces the plan, p describes it, and h2 introduces a subsection. The ul groups the li items. Replace the starter HTML with this example, then run the checks.