Headings
HTML has six heading levels, <h1> to <h6>. Use one <h1> per page for the main title, and use the others in order to organise sections. Search engines and screen readers use headings to understand your page.
<h1>Learn Web Development</h1>
<h2>HTML Basics</h2>
<h3>Text Elements</h3>Paragraphs and line breaks
<p>This is a paragraph. Browsers add space above and below it.</p>
<p>First line<br>Second line in the same paragraph</p>
<hr><p>defines a paragraph.<br>forces a line break and has no closing tag.<hr>draws a horizontal line to separate topics.
Text formatting
<p>This is <strong>important</strong> and this is <em>emphasised</em>.</p>
<p>Water is H<sub>2</sub>O and x<sup>2</sup> means x squared.</p>
<p>Use <mark>highlighted</mark> text sparingly, and <del>deleted</del> or <ins>inserted</ins> text for edits.</p>
<p>Code looks like <code>console.log("Hi")</code>.</p>| Tag | Meaning |
|---|---|
<strong> | Important text (usually bold) |
<em> | Emphasis (usually italic) |
<mark> | Highlighted text |
<code> | Computer code |
Tip: Use headings for structure, not just to make text big. Use CSS to change size.
Practice
Build a page about your favourite hobby with one <h1>, two <h2> sections and a paragraph in each with some bold and emphasised words.