html - 使Bootstrap Nav-Pills响应

使以下导航药有反应时遇到了一些麻烦。前两个“隐藏电话”类可以正常工作，并且应该可以正常工作，但是当我缩小屏幕尺寸时，下面的“可见电话”类不会出现。任何帮助将不胜感激！

<div class="container">
    <div class ="span3">
       <div class="hidden-phone">
          <a><img src=img/logobanner.jpg alt="mobile application development, mobile app        development, mobile application developer, mobile app developer, bespoke mobile application, social media agency london, social media agency manchester"></a>
       </div>
</div>

<div class="hidden-phone">
    <div class ="span5 offset7">
      <ul class="nav nav-pills">
        <li class="active">
      <a href="index.html">Home</a>
      </li>
  <li><a href="testimonials.html">Gallery</a></li>
      <li><a href="contact.html">Contact</a></li>
      <li><a href="http://resonate.so/blog">Blog</a></li>
      </ul>
</div>

  <div class ="span3">
    <div class="visible-phone">
      <ul class="nav nav-pills nav-stacked">
      <li><a href="testimonials.html">Gallery</a></li>
       </ul>
</div>
</div>

    </div>

最佳答案

类别为Visible-phone的图层是先前图层hidden-phone的一部分。我认为您忘记了关闭先例div。注意缩进！

这是我的小提琴：http://jsfiddle.net/AlexandreT/kydEc/

使用垂直拆分器缩小视图。

关于html - 使Bootstrap Nav-Pills响应，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/17232911/