🌐 HTML & CSS Study Guide

📄 HTML Basics

Paragraph: <p> ... </p>

Line Break: <br>

Headings (1–6): <h1> ... </h1><h6> ... </h6>

Bold: <b> ... </b> or <strong> ... </strong>

Italic: <i> ... </i> or <em> ... </em>

Link: <a href="URL"> ... </a>

Image: <img src="URL" alt="description">

Unordered List:

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

Ordered List:

<ol>
  <li>Item</li>
</ol>

Audio:

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

Video:

<video controls width="300">
  <source src="file.mp4" type="video/mp4">
</video>

Marquee (scrolling text): <marquee> ... </marquee>

Divider: <hr>

🎨 CSS Basics

Style Tag: <style> ... </style>

Text Color: p { color: red; }

Background Color: body { background-color: pink; }

Background Image: body { background-image: url('stars.gif'); }

Font Family: body { font-family: 'Comic Sans MS', cursive; }

Border: img { border: 3px dashed hotpink; }

Padding: div { padding: 10px; }

Margin: div { margin: 20px; }

⚡ JavaScript Basics

Button with Alert:

<button onclick="alert('Hello!')">Click Me</button>

Dark Mode Toggle:

<script>
  function toggleDark() {
    document.body.classList.toggle('dark');
  }
</script>

<button onclick="toggleDark()">Dark Mode</button>