bootstrap addTabs使用

暨弘懿
2023-12-01

左边导航菜单:

<a data-url="usr/usr_editpassword.html" data-addtab="usr_editpassword" title="使用问题反馈">
           <i class="glyphicon glyphicon-phone"></i>
          <span class="nav-label">使用问题反馈</span>
 </a>

右边iframe:

<div class="col-md-12" style="margin: 0;padding: 0;">
           <!-- Nav tabs -->
           <ul class="nav nav-tabs" id="tabs1" role="tablist" style="background: #556E7F">
                  <li class="active" role="presentation">
                        <a  > 首页</a>
                   </li>
             </ul>
                    <!-- Tab panes -->
     <div class="tab-content" id="content-main">
        <div class="tab-pane active" id="home" role="tabpanel">
        <iframe id="J_iframe" width="100%" height="100%" src="index-1.html" frameborder="0" data-id="index-1.html" seamless="seamless" name="RightIframe"></iframe></div>
         </div>
   </div>

除了写标签之外还要引入包装好的css以及js文件:

<link rel="stylesheet" type="text/css" href="css/bootstrap.addtabs.css">

<script src="js/bootstrap.addtabs.js"></script>

转载于:https://my.oschina.net/u/3465190/blog/917231

 类似资料: