Açılır menüyü işlevsel olarak kullanabilmemiz için projemize jquery ve bootstrap javascript dosyalarını eklememiz gerekir.

(Bootstrap css dosyasını her durumda projemize ekliyoruz zaten)

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>

Örnek:

data-toggle="dropdown" özelliği ile butonun açılır menü olması sağlanır. dropdown-toggle sınıfı ise parçalanmış kısmın(yeşil kısım) etrafının oval olmasını sağlar. (Resimi inceleyin.)

caret sınıfı ile ucu aşağı bakan üçgen simgesi oluşturulur.

Ekran okuyucularda Parçalı Açılır Menü yazısı çıkar. (sr-only sınıfı sayesinde)

dropdown-menu sınıfı ile açılır liste oluşturulur.

<div class="btn-group">

<button type="button" class="btn btn-primary btn-lg">Açılır Menü</button>

	<button type="button" class="btn btn-success dropdown-toggle btn-lg" data-toggle="dropdown">
	<span class="caret"></span>
	<span class="sr-only">Parçalı Açılır Menü</span>
	</button>
	
	<ul class="dropdown-menu">
		<li><a href="#">Anasayfa</a></li>
		<li><a href="#">Makaleler</a></li>
		<li><a href="#">Yazarlar</a></li>
		<li><a href="#">Hakkımızda</a></li>
	</ul>
	
</div>