bootstrap选项卡

发布时间:2019-07-27 14:15:48

1、选项头

    <ul class="nav nav-tabs">

        <li>

            <a href="#tab"  data-toggle="tab">首页</a>

        </li>

            ...

    </ul>

.nav .nav-tabs----指定为标签选项卡

data-toggle="tab"----指定为选项卡开关

href="#tab"-----指向选项卡所对应的内容

2、内容

<div class="tab-content">

        <div class="tab-pane" id="home">

            <p>内容1内容1内容1内容1内容1内容1内容1内容1内容1内容1</p>

        </div>

</div>

.tab-content----选项卡内容

.tab-pane----选项卡方框

id="home"----为锚点

属性:

fade---淡入淡出

active---激活状态6

远近互联前端小华整理发布,希望能对学习技术的你有所帮助

远近互联专业提供网站建设、APP开发、网站优化、外贸网站SEO、微信运营的品牌整合营销服务让客户通过网络品牌建立与网络传播提高业绩。

【相关推荐】