1. Styling Lists

2. Numbering Style Variations
Applied to <ol> tag
Applied to class placed into <ol> tag
Property: list-style-type

3. Numbering Style Variations

4. Bullet Style Variations
Applied to <ul> tag
Applied to class placed into <ul> tag
Property: list-style-type

5. Bullet Style Variations

6. Property: list-style-image
Problematic because of inconsistent positioning

7. Better Technique – Background-Images
These bullets are 40x40, which is almost too big – so want to keep very small!

8. Styling Nested Lists
Aim at desired level by listing tags in path to it
Example:

9. Using pseudo-selectors to narrow selection criteria
:first-child applied to narrow amount of child tags selected

10. Using pseudo-selectors to narrow selection criteria
:last-child applied to narrow amount of child tags selected

11. Using pseudo-selectors to narrow selection criteria
:last-child applied to narrow amount of child tags selected

12. Using pseudo-selectors to narrow selection criteria
:nth-child(whichOne) applied to narrow amount of child tags selected

13. Using pseudo-selectors to narrow selection criteria
:nth-child(even) applied to narrow amount of child tags selected to even ones

14. Using pseudo-selectors to narrow selection criteria
:nth-child(odd) applied to narrow amount of child tags selected to odd ones

15. Using pseudo-selectors to narrow selection criteria
Combine to alternate