The following code shows how to create Progress based menu.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css"
href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css"
href="http://twitter.github.io/bootstrap/assets/css/bootstrap-responsive.css">
<style type='text/css'>
.progress {<!-- w w w . j av a 2 s . com-->
height: 40px;
font-size: 30px;
}
.bar {
font-size: 30px;
}
</style>
</head>
<body style='margin:30px'>
<div class="container">
<div class="progress">
<div class="bar bar-success" style="width: 35%;">Hello</div>
<div class="bar bar-warning" style="width: 25%;">Hi</div>
<div class="bar bar-danger" style="width: 40%;">Hey</div>
</div>
</div>
</body>
</html>