123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126 |
- <!doctype html>
- <html>
- <head>
- <meta charset="utf-8">
- <title></title>
- <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
- <link rel="stylesheet" href="../style/weui.css"/>
- <link rel="stylesheet" href="../style/weui2.css"/>
- <link rel="stylesheet" href="../style/weui3.css"/>
- <script src="../zepto.min.js"></script>
- <script>
- $(function(){
-
- $('#tab1').tab({defaultIndex:0,activeClass:"tab-green"});
- $('#tab2').tab({defaultIndex:2,activeClass:"tab-red"});
- $('#tab3').tab({defaultIndex:0,activeClass:"tab-blue"});
- $('#tab4').tab({defaultIndex:0,activeClass:"tab-blue "}); $('#tab5').tab({defaultIndex:1,activeClass:"bg_green"});$('#tab6').tab({defaultIndex:2,activeClass:"bg_red"});
- });
-
- </script>
- </head>
- <body ontouchstart style="background-color: #f8f8f8;">
- <div class="weui_tab " style="height:44px;" id="tab1"><!--tab-fixed添加顶部-->
- <div class="weui_navbar" style="height:44px;">
- <div class="weui_navbar_item ">
- 已发货
- </div>
- <div class="weui_navbar_item">
- 未发货
- </div>
- <div class="weui_navbar_item">
- 全部订单
- </div>
- </div>
- </div>
- <h3>分隔样式</h3>
- <div class="weui_tab " style="height:44px;" id="tab2">
- <div class="weui_navbar" style="height:44px;">
- <div class="weui_navbar_item ">
- 已发货
- </div>
- <div class="weui_navbar_item">
- 未发货
- </div>
- <div class="weui_navbar_item ">
- 全部订单
- </div>
- </div>
- </div>
-
- <h3>分隔样式</h3>
-
-
- <div class="weui_tab" style="height:44px;" id="tab3" >
- <div class="weui_navbar" style="height:44px;">
- <div class="weui_navbar_item ">
- 选项一
- </div>
- <div class="weui_navbar_item">
- 选项二
- </div>
- <div class="weui_navbar_item">
- 选项三
- </div>
- <div class="weui_navbar_item">
- 选项四
- </div>
- <div class="weui_navbar_item">
- 选项五
- </div>
- </div>
- </div>
-
- <h3 >分隔样式</h3>
-
-
- <div class="weui_tab" style="height:44px;" id="tab4">
- <div class="weui_navbar" style="height:44px;">
- <div class="weui_navbar_item ">
- 选项一
- </div>
- <div class="weui_navbar_item">
- 选项二
- </div>
- <div class="weui_navbar_item">
- 选项三
- </div>
- </div>
- <div class="weui_tab_bd">
- <div class="weui_tab_bd_item">
- 选项一内容
- </div>
- <div class="weui_tab_bd_item">
- 选项二内容
- </div>
- <div class="weui_tab_bd_item">
- 选项三内容
- </div>
- </div>
- </div>
-
- <h3 >分隔样式</h3>
- <div class='page-hd' >
- <div class="weui_tab" style="height:44px;" id="tab5">
- <div class="weui_tab_nav"> <a href="javascript:" class="weui_navbar_item weui_nav_green"> 中国 </a> <a href="javascript:" class="weui_navbar_item weui_nav_green"> 美国 </a> <a href="javascript:" class="weui_navbar_item weui_nav_green"> 小日本 </a> </div>
- </div>
-
-
- <div class="weui_tab" style="height:44px;" id="tab6">
- <div class="weui_tab_nav"> <a href="javascript:" class="weui_navbar_item weui_nav_red"> 中国 </a> <a href="javascript:" class="weui_navbar_item weui_nav_red"> 美国 </a> <a href="javascript:" class="weui_navbar_item weui_nav_red"> 小日本 </a> </div>
- </div>
-
-
-
-
-
-
-
- </div>
-
-
-
-
- </body>
- </html>
|