🌐 HTML Cheatsheet

🧱 Basic Structure

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

📌 Common Tags

Tag	Description
<html>	Root of the document
<head>	Metadata container
<title>	Title shown on browser tab
<body>	Main content
<h1>-<h6>	Headings
<p>	Paragraph
<br>	Line break
<hr>	Horizontal line
<strong>	Bold text
<em>	Italic text
<div>	Block container
<span>	Inline container

🔗 Links

<a href="https://example.com" target="_blank" rel="noopener noreferrer">Visit Site</a>

🖼️ Images

<img src="image.jpg" alt="Description" width="300" height="200">

📋 Lists

Unordered List

<ul>
  <li>Item</li>
</ul>

Ordered List

<ol>
  <li>First</li>
</ol>

📦 Tables

<table>
  <thead>
    <tr><th>Name</th><th>Age</th></tr>
  </thead>
  <tbody>
    <tr><td>Alice</td><td>25</td></tr>
  </tbody>
</table>

🔘 Forms

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

Common Inputs

<input type="text">
<input type="email">
<input type="password">
<input type="checkbox">
<input type="radio">
<textarea></textarea>
<select><option></option></select>

🧠 Semantic Elements

Tag	Purpose
<header>	Top section
<nav>	Navigation
<main>	Main content
<section>	Grouped content
<article>	Standalone item
<aside>	Sidebar
<footer>	Bottom section

🧩 Media Elements

Audio

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

Video

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
</video>

💡 Metadata & SEO

<meta name="description" content="Brief description of page">
<meta name="keywords" content="HTML, cheat sheet, tutorial">
<meta name="author" content="Your Name">
<link rel="stylesheet" href="styles.css">
<script src="script.js" defer></script>

🪄 Special Characters

Character	Code
&	&
<	<
>	>
"	"
'	'
©	©
™	™

🧪 Useful Attributes

Attribute	Use
class	Styling with CSS
id	Unique identifier
style	Inline CSS
title	Tooltip
hidden	Hide element
disabled	Disable input
required	Make form input mandatory