Ad Code

Responsive Advertisement

HTML Tutorial


📘 HTML Tutorial (Quick & Clear)


1. What is HTML?

  • HTML (Hyper Text Markup Language) structures content on the web.


2. Basic HTML Structure


html

<!DOCTYPE html>

<html>

<head>

  <title>My Page</title>

</head>

<body>

  <h1>Hello, World!</h1>

</body>

</html> 


3. Headings & Paragraphs


html

<h1>Main Title</h1>

<h2>Sub Title</h2>

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


4. Links & Images


html

<a href="https://example.com">Visit Site</a>

<img src="image.jpg" alt="Image description">


5. Lists


html

<ul> <!-- Unordered -->

  <li>Item 1</li>

  <li>Item 2</li>

</ul>


<ol> <!-- Ordered -->

  <li>First</li>

  <li>Second</li>

</ol>


6. Tables


html

<table>

  <tr><th>Name</th><th>Age</th></tr>

  <tr><td>Ana</td><td>25</td></tr>

</table>


7. Forms


html

<form>

  <input type="text" name="username">

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

</form>


8. Media


html

<video controls>

  <source src="video.mp4" type="video/mp4">

</video>


<audio controls>

  <source src="sound.mp3" type="audio/mpeg">

</audio>


9. Div and Span


html

<div style="color:blue;">Block content</div>

<span style="color:red;">Inline content</span>


10.Comments


html

<!-- This is a comment -->

✅ Summary


| Element           | Purpose    |

| ----------------- | ---------- |

| `<h1>` to `<h6>`  | Headings   |

| `<p>`             | Paragraph  |

| `<a>`             | Link       |

| `<img>`           | Image      |

| `<ul>`, `<ol>`    | Lists      |

| `<form>`          | Form       |

| `<table>`         | Table      |

| `<div>`, `<span>` | Containers |

Post a Comment

0 Comments