Skip to content
    SeaCode
    Learning tracksCode ArenaWorkshops & EventsInstructors
    Log inSign up
    </>HTML

    Document foundations

    • What is HTML?
    • Metadata and language
    • Attributes and character references
    • Headings, paragraphs and formatting

    Content and media

    • Links
    • Images
    • Lists
    • Tables
    • Responsive images and media

    Forms

    • Forms and inputs
    • Grouping form controls
    • Form validation and submission

    Structure and accessibility

    • Semantic HTML
    • Keyboard and screen-reader access
    • Disclosure with details
    • Project: your profile page
    HTML

    Document foundations · Lesson 4 of 16

    Headings, paragraphs and formatting

    From h1 to h6, plus bold and italic.

    6 minutes3 games

    There are 6 heading levels: <h1> is the biggest and most important, <h6> the smallest. Use one <h1> per page as its main title. Paragraphs are <p>, and a line break inside one is <br> (it has no closing tag).

    HTML
    <h1>Recipes</h1>
    <h2>Koshari</h2>
    <p>Rice, lentils and pasta,<br>topped with tomato sauce.</p>
    <p>This is <strong>important</strong>, this is <em>emphasised</em>,
    and this is <mark>highlighted</mark>.</p>

    Important

    Heading rank describes content structure, not font size. Use CSS to change appearance.

    Interview question

    How do strong and b differ?

    strong conveys importance and em conveys emphasis. Assistive tools may use these semantics; speech varies with the tool and its settings.

    Complete the code

    Complete: a main heading with a subheading under it.

    <>SeaCode</h1>
    <h2>Learn to code</>

    Order the lines

    Order the page: the heading, then a paragraph with an important word.

    1. Click the lines in the right order

    Exercise

    Make an h1 with your name and a p under it with at least one strong word.

    HTML
    <!-- اكتب هنا -->
    

    Learn more from

    • MDN: HTML referencedeveloper.mozilla.org
    • web.dev: headings-and-sectionsweb.dev

    Played 0 of 3 games

    Sign in to save your progress and earn XP.

    PreviousAttributes and character referencesNextLinks
    SeaCode

    Learn to code for real, online or at our branch in front of Cairo University, Giza.

    Learn

    • All courses
    • Interactive tutorials
    • Interview practice problems
    • Mock interview
    • Learning tracks
    • Code Arena
    • Workshops & Events
    • Knowledge library
    • Team projects

    Your account

    • Log in
    • Sign up
    • Learning plan
    • Certificates
    • Site map

    Contact us

    • WhatsApp
    • 010 9094 1104
    • In front of Cairo University, Giza

    © 2026 SeaCode. All rights reserved.