Styling Nested Lists

You may insert one type of list in another. This is particularly useful with an outline rendered with ordered lists, where you may want several levels of items. While you can style nested lists using classes or ids, there’s an easier way.

To style nested lists:

1.
For styling the outermost list, type toplevel li {style_rules}, where toplevel is the list type of the outermost list (e.g., ol, ul, dt) and style_rules are the styles that should be applied.
2.
For the second level list, type toplevel 2ndlevel li {style_rules}, where toplevel matches the toplevel in step 1 and 2ndlevel is the list type of the second level list.
3.
For the third level list, type toplevel 2ndlevel 3rdlevel li {style_rules}, where toplevel and ...

Get HTML, XHTML, & CSS, Sixth Edition: Visual QuickStart Guide now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.