bootstrap + adminLTE

//bootstrap collapse.js
function getTargetFromTrigger($trigger) {
    var href
    var target = $trigger.attr('data-target')
      || (href = $trigger.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') // strip for ie7
    return $(target)
  }
 //这个表达式的意思是替换'#'之前的字符串
//测试一下'sfdsdf#a#ac'.replace(/.*(?=#[^\s]+$)/,'') 输出: #ac,并不是 #a#ac

//dimension是width或者height,调用offsetHeights有什么用
this.$element[dimension](this.$element[dimension]())[0].offsetHeights 

//jquery children()获取直接下属元素

var actives = this.$parent && this.$parent.children('.panel').children('.in, .collapsing')

//collapse.js对通过data-parent对.panel有些支持,也就是说collapse.js不只导航条用

//overflow auto 和scroll的区别在于scroll滚动条总是出现，而auto只有再需要的时候才出现。

//div.navbar-collapse在宽度达到768px时，会修改.collapse的display为block，所以就可见了。a.navbar-toggle在宽度达到768px时会隐藏。

<nav class="navbar navbar-default">
    <div class="container-fluid">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-id">
                <span class="icon-bar"></span>

              <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">Brand</a>
      </div>
      <div>
          <div class="collapse navbar-collapse" id="navbar-id">
            <ul class="nav navbar-nav">
                <li class="active"><a>Link</a></li>
            </ul>
          </div> 
      </div>
  </div>
</nav>

//ul.nav li的display属性是block。ul.navbar-nav li在宽度大于768px时修改float为left （ul.navbar-nav本身也是float:left）。所以在大屏时会横向排列。
<div class="dropdown">    //class dropdown没有实际属性
    <a class="dropdown-toggle" data-toggle="dropdown">Dropdown</a>    //class dropdown-toggle没有实际属性
    <ul class="dropdown-menu">
        <li><a>menu</a></li>
    </ul>
</div>

div.dropdown可以放在ul.navbar-nav里。

//font-weight字体粗细 400 == normal, 700 == bold