По сути это аналог дельфового treeview. Структура html-страницы для отображения дерева не отличается от любого html файла.
Для реализации потребуется описание стилей CSS или же указать ссылку на файл описания стилей, jquery и немного времени.
По структуре своей дерево простое. Вот так оно выглядит в примитивном виде:
<li>
<span><a href="">1. Ветка</a></span>
<ul>
<li><span><a href="#">1.1. Ветка</a></span></li>
<li><span><a href="#11">1.2. Ветка</a></span></li>
</ul>
</li>
Ну и конечно же, для точто чтобы дерево работало, поскольку оно использует jquery, укажем ссылки на необходимые для этого скрипты, так же разместив их в разделе head страницы.
<script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="js/jquery.cookie.js" type="text/javascript"></script>
<script src="js/jquery.derevo.js" type="text/javascript"></script>
Более подробно о том как реализовать такое дерево со связкой с БД смотрите https://itearn.ru/goto/6757