HTML List Tags (including nested lists)

Unordered List

• Apples - sweet and crispy fruit
• Bananas - yellow curved fruit
• Oranges - citrus fruit full of vitamin C

Nested Unordered List

• Fruits
  • Apples
  • Bananas
  • Citrus
    • Oranges
    • Grapefruit
• Vegetables
  • Leafy
    • Spinach
    • Kale
  • Root
    • Carrots
    • Beetroot

Ordered List with Nested Sub-steps

1. Prepare the batter
   • Sift the flour
   • Beat the eggs
   • Fold wet into dry
2. Preheat the oven to 180°C
3. Bake
   1. Bake for 25 minutes
   2. Increase heat to 200°C for 5 minutes to brown

Mixed Nesting

• Project Plan
  1. Research
  2. Design
  3. Implementation
• Delivery
  • Packaging
  • Shipping

Navigation Menu (semantic)

• Home
• About
  • Team
  • History
• Services
• Contact

Notes & Best Practices

• Put the nested <ul> or <ol> INSIDE the parent <li>.
• Avoid extremely deep nesting — it becomes hard to read and confusing for users and screen readers.
• You can change marker styles with CSS (e.g., list-style-type), but keep default markers for clarity in beginner lessons.