zoukankan      html  css  js  c++  java
  • 使用bootstrap标签页

    关键字:使用标签页,静态调用html页面(使用iframe内联框架)

    完整代码如下:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="css/bootstrap.min.css">
    
        <title>基本资料管理-部门管理</title>
    </head>
    <body>
            <!------------ 标签标题-------------------->
    
           <ul id="myTab" class="nav nav-tabs">
                <li class="active"><a href="#depart" data-toggle="tab">部门管理</a></li>
                <li><a href="#goodssorts" data-toggle="tab">物品分类管理</a></li>
                <li><a href="#measurement" data-toggle="tab">计量单位管理</a></li>
                <li><a href="#input" data-toggle="tab">入库类型管理</a></li>
                <li><a href="#outtype" data-toggle="tab">出库类型管理</a></li>
                <li><a href="#suppliertype" data-toggle="tab">供应商类型管理</a></li>
           </ul>
    
            <!------------ 标签内容-------------------->
    
            <div id="myTabContent" class="tab-content">
                <!-- 部门-->
                <div class="tab-pane fade in active" id="depart">
                    <IFRAME SRC="comAdmin_basic_depart.html" frameborder="0"  width="800px" height="800px"></IFRAME>
                </div>
                <!-- 物品分类-->
                <div class="tab-pane fade" id="goodssorts" >
                    <IFRAME SRC="comAdmin_basic_goodssorts.html" frameborder="0"  width="800px" height="800px"></IFRAME>
                </div>
                <!-- 计量单位-->
                <div class="tab-pane fade" id="measurement" >
                    <IFRAME SRC="comAdmin_basic_measurement.html" frameborder="0"  width="800px" height="800px"></IFRAME>
                </div>
                <!-- 入库类型-->
                <div class="tab-pane fade" id="intype">
                    <IFRAME SRC="comAdmin_basic_intype.html" frameborder="0"  width="800px" height="800px"></IFRAME>
                </div>
                <!-- 出库类型-->
                <div class="tab-pane fade" id="outtype">
                    <IFRAME SRC="comAdmin_basic_outtype.html" frameborder="0"  width="800px" height="800px"></IFRAME>
                </div>
                <!-- 供应商类型-->
                <div class="tab-pane fade" id="suppliertype">
                    <IFRAME SRC="comAdmin_basic_suppliertype.html" frameborder="0"  width="800px" height="800px"></IFRAME>
                </div>
    
            </div>
    
          <script src="js/jquery-2.1.4.min.js"></script>
          <script src="js/bootstrap.min.js"></script>
    </body>
    </html>

    效果图如下所示:

  • 相关阅读:
    如何导入Support v7包?以及使用Support V7下的RecyclerView
    无言是一种教育
    自己的归宿在哪里?
    如是我愿
    【九度OJ】题目1111:单词替换
    【九度OJ】题目1054:字符串内排序
    【九度OJ】题目1061:成绩排序
    【九度OJ】题目1202:排序
    Python项目:扇贝网小组查卡助手
    Ubuntu搭建Ruby on Rails环境
  • 原文地址:https://www.cnblogs.com/shenxiaolin/p/5497998.html
Copyright © 2011-2022 走看看