Вкладені списки призначені для організації складної ієрархічної структури тексту, як правило, юридичних або технічних документів. Також вкладені списки використовуються при створенні багаторівневих меню та навігації по сайту. Щоб створити таку структуру, спочатку створюється список за допомогою <ul>, а вкладений список вставляється всередину одного з елементів < li>, як показано на прикладі 1. Зверніть увагу, що <li> закривається після вкладеного <ul>.
Приклад 1. Вкладений список
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Список</title> </head> <body> <ul> <li>Російська кухня <ul> <li>Вуха бурлацька</li> <li>Бабушкина тюря</li> <li>Розстегай</li> </ul> </li> <li>Українська кухня</li> <li>Молдавська кухня</li> <li>Кавказька кухня</li> <li>Прибалтійська кухня</li> </ul> </body> </html>
Браузери самостійно змінюють вигляд маркерів вкладеного списку, щоб вони відрізнялися від батьківського списку (рис. 1).
Мал. 1. Вигляд вкладеного списку