If you pulled the director and writer out of review.txt, you’ll notice that there was a third row I didn’t use. That row contained a bulleted list. Go ahead and add it to the movie table as a third row:
<tr>
<th>Formats</th>
<td>
* Academy Ratio
* 1.92 Widescreen
</td>
</tr>
Save this and reload it in your web browser, and it all runs together. Browsers ignore white space. If we want the browser to treat those two lines as items in a list, we need to tell it that they are two items in a list.
Things that would normally be displayed as unnumbered lists are unordered lists. The tag for unordered lists is <ul>. The tag for each item in the list is <li>.
<td>
<ul>
<li>Academy Ratio</li>
<li>1.92 Widescreen</li>
</ul>
</td>
The defining characteristic of unordered lists are that the order doesn’t matter; you would never use numbers to count up an unordered list; if you needed a marker, you would use a bullet for each item. We don’t have any in this document, but if the list is ordered, the tag is <ol>. List items remain marked by <li>. Ordered lists are usually displayed with numbers, and sometimes with letters, such as ‘a’, ‘b’, ‘c’, and so on.
List items are both paragraph-level and block-level tags. The <li> tag can contain most paragraph-level and block-level tags. The <ul> and <ol> tags can only contain <li> tags.
Let’s take a look at one more list. This one is also in a table, so add the table first. After the recommendation paragraph and before the “If you enjoyed” headline, create a table with these three rows:
<table id="moreinfo">
<tr><th>Length</th><td>1 hour, 18 minutes</td></tr>
<tr><th>Spoken language</th><td>English</td></tr>
<tr><th>Subtitle</th><td>English</td></tr>
</table>
For the fourth row, add:
<tr>
<th>More links</th>
<td>
<ul class="links">
<li>IMDB details</li>
<li>IMDB reviews</li>
<li>Cast list</li>
<li>Discuss it!</li>
<li>Buy it!</li>
</ul>
</td>
</tr>
This list has a class applied to it, and the class corresponds to a set of styles in the style sheet that drastically alter how the list appears in visual browsers. Underneath, however, it remains a list and is treated that way by software.
