分享一个不错的选项卡tabpane支持firefox
TAB效果图：http://dl.iteye.com/upload/attachment/196737/9f3824ab-a88c-3460-99be-22aec3bac6fd.png
Tab_m.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><script src="tabpane.js" type="text/javascript"></script><link href="tab.css" rel="stylesheet" type="text/css" /><title>Tab</title><style type="text/css">.blockTable {border: #BBBBBB 0px solid;background: url(images/tableBg_left.gif) no-repeat left top;}.blockTd {background: url(images/tableBg_right.gif) no-repeat right top;}</style></head><body><table width="100%" border="0" cellspacing="6" cellpadding="0" style="border-collapse: separate; border-spacing: 6px;"><tr valign="top"> <td><table width="100%" border="0" cellspacing="0" cellpadding="6" class="blockTable"> <tr> <td valign="middle" class="blockTd"> <div class="tab-pane"id="tabPaneB"> <div class="tab-page" style="height: 200px" id="tabPage1"> <h2 class="tab" value="1">日报表</h2> </div> <div class="tab-page" style="height: 200px" id="tabPage2"> <h2 class="tab" value="2">月报表</h2> </div> <div class="tab-page" style="height: 200px" id="tabPage3"> <h2 class="tab" value="3">年报表</h2> </div> <div class="tab-page" style="height: 200px" id="tabPage4"> <h2 class="tab" value="4">通用报表</h2> </div> </div> </td> </tr> </table></td></tr></table></body></html> tab.css
/*bright: #F9FCFF;normal: rgb(120,172,255);dark:rgb(0,66,174);*/li{height: 18px; line-height: 18px;font-size: 14px;}.dynamic-tab-pane-control.tab-pane {position:relative;width:100%;}.dynamic-tab-pane-control .tab-row .tab {border:1px solid #BEC9CF;border-top:0px;border-bottom:0px;font-size:12px;cursor:Default;display:inline;margin:1px 0px 1px 5px;float:left;padding:3px 6px 3px 6px;cursor:hand;cursor:pointer;z-index:1;position:relative;top:-2px;background: url(images/s_tabout_bg_left.gif) -2px 0px ;height:25px;line-height:25px;}.dynamic-tab-pane-control .tab-row .tab.selected {border:1px solid #BEC9CF;border-top:0px;border-bottom:0px;z-index:3;padding:3px 6px 3px 6px;margin:1px 0px 1px 5px;top:-4px;background: url(images/s_tabover_bg_left.gif) -2px 0px ;height:27px;line-height:27px;}.dynamic-tab-pane-control .tab-row .tab a {font-family:Verdana, Helvetica, Arial;font-size:13px;color:rgb(0,66,174);text-decoration:none;cursor:hand;cursor:pointer;}.dynamic-tab-pane-control .tab-row .hover a {color:rgb(0,66,174);}.dynamic-tab-pane-control .tab-row .tab.selected a {font-weight:bold;}.dynamic-tab-pane-control .tab-page {clear:both;z-index:2;position:relative;top:-5px;color:Black;font-size:13px;padding:10px;border-top:1px solid #BEC9CF;}.dynamic-tab-pane-control .tab-row {z-index:1;white-space:nowrap;height:32px;width:100%;}
页:
[1]