HTML tutorial

welcome to this page and here i will teach you the basics

1. Basic Structure

Every HTML page starts with a basic structure heres a example:

<!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>
        <h1>Hello, World!</h1>
        <p>This is a paragraph.</p>
    </body>
</html>

Explanation:

<!DOCTYPE html> - Declares the document type and version of HTML.
<html> - The root element of the HTML document.
<head> - Contains meta-information about the document.
<body> - Contains the content of the document.

2. Headings and Paragraphs

Headings are defined using <h1> to <h6> tags, and paragraphs are defined using the <p> tag.

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

3. Links and Images

Links are created using the <a> tag, and images are inserted using the <img> tag.

<a href="https://www.example.com">This is a link</a>
<img src="image.jpg" alt="Description">

Explanation:

<a href="URL"> - Creates a hyperlink to the specified URL.
<img src="image.jpg" alt="Description"> - Embeds an image with a source and alternate text.

4. Lists

HTML supports ordered and unordered lists:

<ul>
    <li>Item 1</li>
    <li>Item 2</li>
</ul>

<ol>
    <li>First item</li>
    <li>Second item</li>
</ol>

5. Tables

Tables are created using the <table> tag, with rows defined by <tr> and cells by <td>:

<table>
    <tr>
        <th>Header 1</th>
        <th>Header 2</th>
    </tr>
    <tr>
        <td>Cell 1</td>
        <td>Cell 2</td>
    </tr>
</table>

6. Forms

Forms are created using the <form> tag and include various input elements:

<form action="/submit" method="post">
    <label for="name">Name:</label>
    <input type="text" id="name" name="name">

    <label for="email">Email:</label>
    <input type="email" id="email" name="email">

    <input type="submit" value="Submit">
</form>

Congratulations! You've learned the basics of HTML. Start experimenting by creating your own HTML documents and see what you can build!