Contents

HTML Cheat Sheet

HTML Cheat Sheet

Note: Content refferenced from: developer.mozilla.org.

Do check it out. It’s one of the best sources for learning HTML


The Basics:

First thing to know is page structure.

HTML Element

<html></html>

The html element represents the root or Top-level element of an html document. This is also reffered to as the root element. ALL other elements must be decendence of this element. This follows the <head> element.

Main Body Element

<body></body>

This is the main Element that represnets the content of an HTML document. There can only be ONE <body> element. This is contained in the <html> element.

Content Division Element

<div></div>

General purpose container for how the content flows on the page. Used to help layout the structure of the page when combined with CSS styles There can be any number of <div> elements in the document. This must be contained inside the <body> element.

Next is how to display text/content.

Headings Element

<h1>Heading 1 text</h1>

Heading 1 text

<h2>Heading 2 text</h2>

Heading 2 text

<h3>Heading 3 text</h3>

Heading 3 text

<h4>Heading 4 text</h4>

Heading 4 text

<h5>Heading 5 text</h5>
Heading 5 text
<h6>Heading 6 text</h6>
Heading 6 text

<h1> to <h6> elements represent 6 levels of section headings. From <h1> (Largest) to <h6> (Smallest)

Pharagraph Container

<p>"Some text"</p>

“Some Text”

Represents the Paragraph element. Paragraphs can contain text blocks, by blank lines or grouping related content like images and forms

Code Container

<pre><code>"Hello World!"</code></pre>

“Hello World!”

Displaying blocks of code. Used to tell document renderer that this block with contain code, and to render/output accordingly