You are viewing a free preview of this lesson.
Subscribe to unlock all 10 lessons in this course and every other course on LearningBro.
Lists and tables are essential HTML elements for organising content. Lists present items in ordered or unordered sequences. Tables display data in rows and columns. Using them correctly improves readability, accessibility, and the semantic quality of your web pages.
An unordered list displays items with bullet points. Use it when the order does not matter:
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
<ul>
<li>Front-end
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</li>
<li>Back-end
<ul>
<li>Node.js</li>
<li>Python</li>
<li>Ruby</li>
</ul>
</li>
</ul>
An ordered list displays items with numbers. Use it when the sequence matters:
<ol>
<li>Preheat the oven to 180°C</li>
<li>Mix the flour and sugar</li>
<li>Add the eggs and milk</li>
<li>Bake for 25 minutes</li>
</ol>
| Attribute | Purpose | Example |
|---|---|---|
type | Numbering style | type="A" (A, B, C), type="i" (i, ii, iii) |
start | Starting number | start="5" (starts at 5) |
reversed | Count down instead of up | <ol reversed> |
<ol type="A" start="3">
<li>Item C</li>
<li>Item D</li>
<li>Item E</li>
</ol>
Subscribe to continue reading
Get full access to this lesson and all 10 lessons in this course.