Bootstrap学习笔记，4--导航栏 - Jacklovely

Bootstrap学习笔记（4）--导航栏

相关类：

nav, nav-pills, nav-tags, nav-stacked ul里使用，导航格胶囊，方片外观，堆叠外观

navbar, navbar-header, navbar-brand, navbar-nav, navbar-default, 导航条相关类

dropdown, dropdown-menu, dropdown-toggle,二级菜单相关类

divider二级导航里的分割线

相关属性：

data-toggle="tab",点击导航格会变为选中状态，背景颜色改变

data-toggle="dropdown",点击弹出二级菜单

说明：不用记太多类，记住几个必须用到类就行，其他的可以用jquery解决。

<div class="container">
        <div>
            <ul class="nav nav-pills">
                <li class="active"><a href="">主页</a></li>
                <li><a href="">主页</a></li>
                <li><a href="">主页</a></li>
                <li>
                    <a data-toggle="dropdown" href="">主页<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="">123</a></li>
                        <li><a href="">123</a></li>
                        <li><a href="">123</a></li>
                    </ul>
                </li>
            
            </ul>
        </div>

posted on 2017-02-23 13:30 Jacklovely 阅读(932) 评论(0) 编辑收藏举报