使用bootstrap标签页
生活随笔
收集整理的這篇文章主要介紹了
使用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>效果圖如下所示:
轉載于:https://www.cnblogs.com/shenxiaolin/p/5497998.html
總結
以上是生活随笔為你收集整理的使用bootstrap标签页的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Server.MapPath()目录详解
- 下一篇: jQuery.validator.add