Simple Tree

Простое сворачиваемое дерево на чистом CSS без использования JS и изображений.

Демо

http://psnet.github.io/simple-tree/demo/

Часть кода из демо:

<ul class="simple-tree">
  <li>
    <input type="checkbox" checked="checked" id="simple-tree-item-1" />
    <label for="simple-tree-item-1">Folder</label>
    <ul>
      <li>Item 1</li>
      <li>Item 2</li>
      <li>Item 3</li>
    </ul>
  </li>
  <li>
    <input type="checkbox" checked="checked" id="simple-tree-item-2" />
    <label for="simple-tree-item-2">Folder</label>
    <ul>
      <li>
        <input type="checkbox" checked="checked" id="simple-tree-item-3" />
        <label for="simple-tree-item-3">Folder</label>
        <ul>
          <li>Item 1</li>
          <li>Item 2</li>
          <li>Item 3</li>
        </ul>
      </li>
      <li>Item 3</li>
    </ul>
  </li>
</ul>

Подключение

• Подключить CSS файл
• Создать html код по примеру кода из демо

Лицензия

(P) PSNet 2014

Attribution-ShareAlike 3.0 Unported (CC BY-SA 3.0)