如何在引导程序中将文本放在导航栏品牌下方？

Question

假设我有一个 Bootstrap 3 导航栏，其导航栏品牌包含文本，我如何添加一个适合该导航栏品牌正下方的小字幕？

Answer 1

@cab 的解决方案有效，但这里有另一个选项，不会影响默认导航栏的高度（由于填充增加）：

.navbar-brand {
  line-height:12px;
  padding-top:20px;
  padding-bottom:5px;
}

.navbar-brand small {
  display:block;
  font-size:10px;
}

http://bootply.com/106312

Answer 2

这是一种方法：

演示：http://jsbin.com/AFiNehIz/1/edit

---

HTML

 <a class="navbar-brand" href="#">Project name<small>Tagline goes here</small></a>

---

CSS

.navbar-brand small {
  display:block;
  font-size:12px;
}

.navbar-toggle {top:10px}

@media (min-width:768px) {
  
  .navbar-brand {
    padding-top:20px;
  }
  
  .nav.navbar-nav a {
    padding-top:30px;
    padding-bottom:30px;
  }

}

Answer 3

अलेकफययेसलीजलीजलीजईई。 नेआंधी 971 808 356 2पटट