Lists, Links and Images

Lists

HTML provides three kinds of lists:

1. Unordered list <ul> — items shown with bullets, where the order does not matter. Each item is a list item <li>.

<ul>
  <li>Pen</li>
  <li>Pencil</li>
  <li>Eraser</li>
</ul>

2. Ordered list <ol> — items shown with numbers (or letters), where the order matters, such as the steps of a procedure.

<ol>
  <li>Open the browser.</li>
  <li>Type the web address.</li>
  <li>Press Enter.</li>
</ol>

3. Description (definition) list <dl> — a list of terms and their descriptions, where <dt> marks the term and <dd> marks its description.

<dl>
  <dt>HTML</dt>
  <dd>The markup language that structures a web page.</dd>
  <dt>CSS</dt>
  <dd>The language that styles a web page.</dd>
</dl>

Hyperlinks (Links)

A hyperlink lets a visitor move from one page to another (or to a different section of the same page) with a click — this ability to link documents together is the "HyperText" in HTML. Links are created with the anchor tag <a>, and the destination is given by its href attribute.

<a href="about.html">About Us</a>

The text between <a> and </a> ("About Us" above) is what the visitor sees and clicks. A link can point to another page of the same site (as above), or to a full web address (href="https://..."). Adding the attribute target="_blank" opens the linked page in a new browser tab.

<a href="contact.html" target="_blank">Contact us in a new tab</a>

Images …