正确实现bootstrap侧边栏的方法

时间:2017-03-12 00:20:49

标签: html twitter-bootstrap

亲爱的惊人的stackoverflow人,

虽然这种方法有效但感觉效率不高。此外,侧杆填充距离左手边缘相当远。有没有更熟练的方法来实现侧边栏?

<div class="container">
<div class="row">


      <div class="col-md-2 sidebar">

          <ul class="nav nav-sidebar">
            <li class="active"><a href="#">Overview <span class="sr-only">(current)</span></a></li>
            <li><a href="#">Reports</a></li>
            <li><a href="#">Analytics</a></li>
            <li><a href="#">Export</a></li>
          </ul>
          <ul class="nav nav-sidebar">
            <li><a href="">Nav item</a></li>
            <li><a href="">Nav item again</a></li>
            <li><a href="">One more nav</a></li>
            <li><a href="">Another nav item</a></li>
            <li><a href="">More navigation</a></li>
          </ul>
          <ul class="nav nav-sidebar">
            <li><a href="">Nav item again</a></li>
            <li><a href="">One more nav</a></li>
            <li><a href="">Another nav item</a></li>
          </ul>
      </div>



      <div class="col-md-4">

      <div class="thumbnail">
        <img src="images/lambo.jpg" alt="...">
        <div class="caption">
          <h3>Thumbnail label</h3>
          <p>...</p>
          <p><a href="#" class="btn btn-primary" role="button">Button</a> <a href="#" class="btn btn-default" role="button">Button</a></p>
        </div>
      </div>

enter image description here

1 个答案:

答案 0 :(得分:2)

我没有评论这个的原因是因为我没有足够的声誉,如果你想修复侧栏填充,那么你必须将你的CSS包含在问题中。否则我们无法真正告诉你问题是什么。

查看此链接,它正在为更动态的导航栏编码

https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_sidenav_push