Toggle navigation
Bootsnipp
Bootstrap
For
CSS Frameworks
Bootstrap
Foundation
Semantic UI
Materialize
Pure
Bulma
References
CSS Reference
Tools
Community
Page Builder
Form Builder
Button Builder
Icon Search
Dan's Tools
Diff / Merge
Color Picker
Keyword Tool
Web Fonts
.htaccess Generator
Favicon Generator
Site Speed Test
Snippets
Featured
Tags
By Bootstrap Version
4.1.1
4.0.0
3.3.0
3.2.0
3.1.0
3.0.3
3.0.1
3.0.0
2.3.2
Register
Login
"Sidebar menu"
Bootstrap 3.3.0 Snippet by
botyk
3.3.0
menu
sidebar
Preview
HTML
CSS
View Full Screen
Fork
Fork this
20.2K
 
5 Fav
Post to Facebook
Tweet this
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"> <div class="list-group"> <div class="list-group"><a href="#SoftPc" class="list-group-item" data-toggle="collapse" aria-expanded="false" aria-controls="collapseExample"><i class="fa fa-folder-o"></i> Программы для PC <div style="margin-top:-2px;" class="pull-right"><i class="fa fa-sort-desc"></i></div></a> <div class="collapse" id="SoftPc"> <div class="woll"> <div class="list-group ssilka"> <a href="/soft/cd-dvd" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> CD/DVD диски</a> <a href="/soft/audio-video" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Аудио/Видео</a> <a href="/soft/security" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Безопасность</a> <a href="/soft/internet" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Интернет</a> <a href="/soft/system" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Система</a> <a href="/soft/office" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Офис</a> </div> </div> </div> <a href="#SoftMobile" class="list-group-item" data-toggle="collapse" aria-expanded="false" aria-controls="collapseExample"><i class="fa fa-folder-o"></i> Приложения для Mobile <div style="margin-top:-2px;" class="pull-right"><i class="fa fa-sort-desc"></i></div></a> <div class="collapse" id="SoftMobile"> <div class="woll"> <div class="list-group ssilka"> <a href="/mobile/smartfon" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Для smartfon</a> <a href="/mobile/android" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Для android</a> <a href="/mobile/ipod" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Для ipod</a> <a href="/mobile/java" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Для java</a> </div> </div> </div> <a href="#WebDevelopment" class="list-group-item" data-toggle="collapse" aria-expanded="false" aria-controls="collapseExample"><i class="fa fa-folder-o"></i> Веб-разработка <div style="margin-top:-2px;" class="pull-right"><i class="fa fa-sort-desc"></i></div></a> <div class="collapse" id="WebDevelopment"> <div class="woll"> <div class="list-group ssilka"> <a href="/web-development/joomla" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Joomla</a> <a href="/web-development/wordpress" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Wordpress</a> <a href="/web-development/dle" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> DataLife Engine</a> <a href="/web-development/torrentpier" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> TorrentPier</a> <a href="/web-development/other_cms" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Другие CMS</a> </div> </div> </div> <a href="#ArchiveBooks" class="list-group-item" data-toggle="collapse" aria-expanded="false" aria-controls="collapseExample"><i class="fa fa-folder-o"></i> Архив книги <div style="margin-top:-2px;" class="pull-right"><i class="fa fa-sort-desc"></i></div></a> <div class="collapse" id="ArchiveBooks"> <div class="woll"> <div class="list-group ssilka"> <a href="/books/books_akida" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Акида (книга)</a> <a href="/books/books_manhaj" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Манхадж (книга)</a> <a href="/books/books_fiqh" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Фикх (книга)</a> <a href="/books/books_hadith" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Хадисы (книга)</a> <a href="/books/books_koran" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Коран (книга)</a> <a href="/books/books_arabic" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Арабский язык (книга)</a> <a href="/books/books_beginner" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Для начинающих (книга)</a> </div> </div> </div> <a href="#ArchiveAudio" class="list-group-item" data-toggle="collapse" aria-expanded="false" aria-controls="collapseExample"><i class="fa fa-folder-o"></i> Архив аудио <div style="margin-top:-2px;" class="pull-right"><i class="fa fa-sort-desc"></i></div></a> <div class="collapse" id="ArchiveAudio"> <div class="woll"> <div class="list-group ssilka"> <a href="/audio/audio_koran" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Коран (аудио)</a> <a href="/audio/audio_akida" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Акида (аудио)</a> <a href="/audio/audio_manhaj" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Манхадж (аудио)</a> <a href="/audio/audio_fiqh" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Фикх (аудио)</a> <a href="/audio/audio_hadith" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Хадисы (аудио)</a> <a href="/audio/audio_arabic" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Арабский язык (аудио)</a> <a href="/audio/audio_beginner" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Для начинающих (аудио)</a> </div> </div> </div> <a href="#ArchiveVideo" class="list-group-item" data-toggle="collapse" aria-expanded="false" aria-controls="collapseExample"><i class="fa fa-folder-o"></i> Архив видео <div style="margin-top:-2px;" class="pull-right"><i class="fa fa-sort-desc"></i></div></a> <div class="collapse" id="ArchiveVideo"> <div class="woll"> <div class="list-group ssilka"> <a href="/video/islamic_video" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Исламский видео</a> <a href="/video/other_videos" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Разное видео</a> </div> </div> </div> <a href="#paid_section" class="list-group-item" data-toggle="collapse" aria-expanded="false" aria-controls="collapseExample"><i class="fa fa-folder-o"></i> Платный раздел <div style="margin-top:-2px;" class="pull-right"><i class="fa fa-sort-desc"></i></div></a> <div class="collapse" id="paid_section"> <div class="woll" style="margin-bottom:15px;"> <div class="list-group ssilka"> <a href="/paid_section/site_development" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Создание сайта</a> <a href="/paid_section/pc_repair" class="list-group-item"><i class="fa fa-long-arrow-right"></i> <i class="fa fa-folder-open-o"></i> Ремонт Пк (онлайн)</a> </div> </div> </div> </div>
.woll { margin-bottom: -21px; } .ssilka a{ color:#0080C0; } .ssilka a:hover{ color:#0080C0; } .list-group-item:last-child { border-radius: 0; } .list-group-item:first-child{ border-radius: 0; }
Questions / Comments:
Post
Posting Guidelines
Formatting
- Now
×
Close
Donate
BTC: 12JxYMYi6Vt3mx3hcmP3B2oyFiCSF3FhYT
ETH: 0xCD715b2E3549c54A40e6ecAaFeB82138148a6c76