All Html Codes With Examples

9 min read Jul 03, 2024

All HTML Codes with Examples

This article will provide you with a comprehensive list of commonly used HTML codes and their examples. Understanding these codes is essential for creating web pages.

Basic HTML Structure

The fundamental structure of an HTML document is defined by the following elements:

<html>: This is the root element of every HTML document, containing all other elements.
<head>: Contains meta-information about the document, such as title, links to stylesheets, and scripts.
```
    My Web Page
    
```
<body>: Contains the visible content of the HTML document, including text, images, and other elements.
```
    Welcome to my website
    This is a paragraph of text.
```

Text Formatting Elements

These elements are used to format the text within your HTML document:

<h1> to <h6>: Heading tags used to create headings of different sizes.
```
Main Heading
Sub Heading
Sub-Sub Heading
```

<p>: Creates a paragraph of text.

This is a paragraph of text. It will be displayed as a separate block on the page.

<b>: Makes text bold.
```
This text is bold.
```
<strong>: Makes text bold and indicates importance.
```
This text is important and bold.
```
<i>: Makes text italic.
```
This text is italic.
```
<em>: Makes text italic and indicates emphasis.
```
This text is emphasized and italic.
```

<br>: Inserts a line break.

This is a line of text.
This is another line of text.

<pre>: Displays text in a pre-formatted way, preserving whitespace and line breaks.

This is a pre-formatted text.
It preserves all spaces and line breaks.

Structural Elements

These elements are used to structure content and create sections within your page:

<div>: A generic container element, used to group other elements.
```
    Section Title
    Content of the section.
```
<span>: An inline container element, used to group other elements that should be styled together.
```
This is a paragraph with a highlighted word.
```
<ul>: An unordered list, used for creating bullet point lists.
```
    Item 1
    Item 2
    Item 3
```
<ol>: An ordered list, used for creating numbered lists.
```
    Item 1
    Item 2
    Item 3
```
<li>: List item element, used within <ul> and <ol>.
```
    List item 1
    List item 2
```

<table>: Creates a table.


    
        Column 1
        Column 2
    
    
        Data 1
        Data 2

<tr>: Table row element, used within <table>.
```
    Data 1
    Data 2
```
<th>: Table header element, used within <tr>.
```
Column Header
```
<td>: Table data element, used within <tr>.
```
Data in the cell
```

Column 1	Column 2
Data 1	Data 2

Image and Multimedia Elements

<img>: Inserts an image into the webpage.

<audio>: Embeds audio content.

<video>: Embeds video content.

Links and Navigation Elements

<a>: Creates a hyperlink.
```
Visit Example Website
```

<nav>: A navigational element used to create menus and navigation bars.


    
        Home
        About
        Contact

Form Elements

<form>: Creates a form for user input.
```
    
    
    
```
<input>: Creates an input field for user input.
<button>: Creates a button.
<textarea>: Creates a multi-line text input field.

<select>: Creates a dropdown list.

<option>: Option element, used within <select>.

Other Important Elements

<style>: Used to define styles within the HTML document.

<script>: Used to include JavaScript code in the HTML document.
<meta>: Provides metadata about the HTML document.

This list provides a good starting point for understanding common HTML codes and how to use them to create web pages. Remember to consult the official HTML documentation for more detailed information and a complete list of HTML elements and attributes.

All Html Codes With Examples