HTML Cheat Sheet

Learn Frontend

HTML Cheat Sheet

Natalia Jackson

•

Last modified:

October 3, 2024

Document Structure:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document Title</title>
</head>
<body>
    <!-- Content goes here -->
</body>
</html>

Essential Tags:

<html>: Root element of an HTML page.
<head>: Contains meta-information about the document.
<title>: Specifies the title of the document.
<body>: Contains the content of the HTML document.
<meta>: Specifies metadata about the HTML document.

Text Formatting

<h1> to <h6>: Header tags, <h1> being the most important, and <h6> the least.
<p>: Paragraph tag.
<br>: Line break.
<hr>: Thematic break in the page.
<strong> / <b>: Bold text.
<em> / <i>: Italicized text.
<u>: Underlined text.
<sup>: Superscript text.
<sub>: Subscript text.

Hyperlinks and Images

<a href="url">link text</a>: Creates a hyperlink.
<img src="url" alt="alternative text">: Embeds an image.

Lists

Unordered List:

<ul>
    <li>List item</li>
    <li>List item</li>
</ul>

Ordered List:

<ol>
    <li>List item</li>
    <li>List item</li>
</ol>

Tables

<table>
    <tr>
        <th>Header</th>
        <th>Header</th>
    </tr>
    <tr>
        <td>Data</td>
        <td>Data</td>
    </tr>
</table>

Forms

<form action="submit.php" method="post">
    <label for="name">Name:</label>
    <input type="text" name="name">
    <br>
    <label for="email">Email:</label>
    <input type="email" name="email">
    <br>
    <input type="submit" value="Submit">
</form>