---

HTML Lists

Ordered List (Numbered):

<ol>

  <li>First item</li>

  <li>Second item</li>

</ol>

Unordered List (Bulleted):

<ul>

  <li>Red</li>

  <li>Blue</li>

</ul>

Description List:

<dl>

  <dt>Coffee</dt>

  <dd>Black hot drink</dd>

  <dt>Milk</dt>

  <dd>White cold drink</dd>

</dl>

HTML Links

Basic Link:

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

Link Attributes:

- target="_blank" (Opens in new tab)

- title="Tooltip" (Hover description)

- id="section1" (Anchor for page jumps)

Email Link:

<a href="mailto:email@example.com">Email Us</a>

Page Jump:

<a href="#section1">Go to Section 1</a>

...

<h2 id="section1">Section 1</h2>

HTML Images

Basic Image:

<img src="photo.jpg" alt="Description">

Important Attributes:

- src (Image path)

- alt (Accessibility text)

- width/height (Dimensions in pixels)

Image as Link:

<a href="page.html">

  <img src="button.jpg" alt="Clickable button">

</a>

Figure with Caption:

<figure>

  <img src="diagram.png" alt="Chart">

  <figcaption>Figure 1: Data analysis</figcaption>

</figure>