HTML & CSS · Quick Reference

Lesson 4 — Forms, Tables & Lists Cheat Sheet

HTML & CSS

In one line: HTML has three list types. Unordered lists use bullet points for items without a specific order. Ordered lists are numbered. Description lists pair terms with definitions — grea...

Key Ideas

1Lists — ul, ol, dl. HTML has three list types. Unordered lists use bullet points for items without a specific order. Ordered lists are numbered. Description lists pair terms with definiti...

2HTML Tables. Tables are for tabular data — think spreadsheets, schedules, comparison charts. They should never be used for page layout (that's what CSS is for). A well-structured t...

3HTML Forms — The <form> Element. Forms are how users send data to a server. The <form> element wraps all inputs. Two key attributes: action (where to send data) and method (GET or POST). Always ...

4All Input Types. The type attribute on <input> determines what kind of data is collected and which mobile keyboard appears. Using the correct type also enables built-in browser v...

Code Examples

<!-- Unordered list (bullets) -->
<ul>
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ul>

<!-- Ordered list (numbered, default 1, 2, 3…) -->
<ol>
  <li>Install VS Code...

<table>
  <!-- Caption: accessible title of the table -->
  <caption>Student Exam Results — Phase 1</caption>

  <!-- thead: column headers -->
  <thead>
    <tr>
      <th scope="col">Name</th>
...

<!-- action: URL to submit to. method: GET or POST -->
<form action="/submit" method="POST">

  <!-- fieldset + legend groups related inputs -->
  <fieldset>
    <legend>Personal Information</legend>

    <!-- l...