Constructing Content - HTML5 with CSS3 - page 100

The type and start attributes existed in older versions of HTML, but were phased out
in XHTML because they were considered presentational. They've been brought back in
HTML5 because they do have real meaning in some situations. You should only use
these attributes when the content demands it, and use CSS when you only want the
visual effect.
li
In both ordered and unordered lists, the li element defines individual list items. A list item can contain text
or any flow elements, including more lists. Listing 4-23 shows an elaborate unordered list with more lists
nested within it. The containing list has only a single item in this example, but you could add any number of
costume accessories within that list, each following the same pattern in its own li .
Listing 4-23. A complex unordered list
<h1>Costume Accessories</h1>
<p>All the trappings and trimmings.</p>
<ul>
<li>
<h2>Masks and Cowls</h2>
<p>Protect your secret identity.</p>
<ul>
<li> Domino mask </li>
<li> Half-mask
<ul>
<li> Traditional upper face mask </li>
<li> Lower face “surgical” mask </li>
</ul>
</li>
<li> Full face mask (eye lenses optional) </li>
<li> Cowl
<ul>
<li> Classic loose cowl (hood) </li>
<li> Fitted cowl </li>
<li> Fitted cowl with integrated upper half-mask </li>
</ul>
</li>
</ul>
</li>
</ul>
When one list is nested within another, the inner list will, by default, be styled differently according to its
level of nesting. Figure 4-10 shows how this list is rendered, and you can see that each nested list is
indented a bit further and displayed with a different style of marker. Nested ordered lists inherit their
numbering style from their parent, but will begin a new numbering sequence.