<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link rel="stylesheet" type="text/css" href="webclientstyle.css">
<style type="text/css">
  a
  {
    color: #000000;
    text-decoration: none;
  }
  a:hover
  {
    color: #000000;
    text-decoration: underline;
  }
  td
  {
    font-size   :9pt;
    font-family :Arial, Helvetica, sans-serif;
    font-weight :bold;
  }
  blockquote
  {
    padding-left     :0.5cm;
    padding-right    :0.5cm;
  }
</style><script language="JavaScript" src="dhtml.js"></script>
<script language="Javascript">
  
  var tabid     = new Array("General", "Staff", "DataStructures",
                            "Documentation", "History", "InputContainer"                         
                            )
  var tabtext   = new Array("全部",
                            "待用",
                            "运行中",
                            "未入库",
                            "检修中",
                            "报废/失窃/转出"
                            )
  
</script><!-- --------------------------------------------- //-->
<!-- ---------- Java String Definitions ---------- //-->
<!-- --------------------------------------------- //--><!-- --------------------------------------------- //-->
<!-- ------- End of Java String Definitions ------ //-->
<!-- --------------------------------------------- //--></head><body onLoad="javascript:initTabedPane(0)">
<!-- --------------------------------------------- //-->    
<!-- --------------- Title ----------------------- //-->    
<!-- --------------------------------------------- //-->    
<div class="title" align="center">设备资产管理</div>
<!-- --------------------------------------------- //-->
<!-- ----- Tab Contexts till End of Code --------- //-->
<!-- --------------------------------------------- //-->
<!----------------- General ---------------------- //-->
<div id="General" class="tabbody">
<br>
  <table width="700" style="position: static">
  <tr>
  <td><input type=checkbox name=All></td>
  <td>局编号</td>
  <td>型号</td>
  <td>容量</td>
  <td>制造厂</td>
  <td>出厂编号</td>
  <td>周转状态</td>
  <td></td>
  <td></td>
  </tr>  
  </table>
<br>
</div>
<!-------------- End of General ------------------- //-->
<!------------------ Staff ------------------------ //-->
<div id="Staff" class="tabbody">
<br>
  <table  width="700">
  <tr>
  <td></td>
  <td>局编号</td>
  <td>型号</td>
  <td>容量</td>
  <td>制造厂</td>
  <td>出厂编号</td>
  <td>原因</td>
  <td>支付日期</td>
  <td></td>
  </tr>  
  </table>
<br>
</div>
<!------------------- End of Staff ---------------- //-->
<!------------------ Data Structures ------------------------ //-->
<div id="DataStructures" class="tabbody">
<br>
    <table  width="700">
  <tr>
  <td></td>
  <td>局编号</td>
  <td>型号</td>
  <td>容量</td>
  <td>制造厂</td>
  <td>出厂编号</td>
  <td>原因</td>
  <td>支付日期</td>
  <td></td>
  </tr>  
  </table>
<br>
</div>
<!------------------- End of Data Structures ---------------- //--><!----------------- Documentation ----------------- //-->
<div id="Documentation" class="tabbody">
<br>
    <table  width="700">
  <tr>
  <td></td>
  <td>局编号</td>
  <td>型号</td>
  <td>容量</td>
  <td>制造厂</td>
  <td>出厂编号</td>
  <td>原因</td>
  <td>支付日期</td>
  <td></td>
  </tr>  
  </table>
<br>
</div>
<!---------------- End of Documentation ----------- //--><!--------------------- History ------------------- //-->
<div id="History" class="tabbody">
<br>
    <table  width="700">
  <tr>
  <td></td>
  <td>局编号</td>
  <td>型号</td>
  <td>容量</td>
  <td>制造厂</td>
  <td>出厂编号</td>
  <td>原因</td>
  <td>支付日期</td>
  <td></td>
  </tr>  
  </table>
<br>
</div>
<!----------------- End of History ---------------- //--><!--------------- Input_Container ----------------- //-->
<div id="InputContainer" class="tabbody" style="width:700px;">
<br>
    <table  width="700">
  <tr>
  <td></td>
  <td>局编号</td>
  <td>型号</td>
  <td>容量</td>
  <td>制造厂</td>
  <td>出厂编号</td>
  <td>原因</td>
  <td>支付日期</td>
  <td></td>
  </tr>  
  </table>
<br>
</div>
<!------------- End of Input Container ------------ //-->
</body></html>

解决方案 »

  1.   


    body
    {
      background-color: #C6C6C6;
      font-family: Arial, Helvetica, sans-serif;
    }.helphead
    {
      color           :#FFFFFF;
      background-color:#3163FF;
      border-color    :#FFFFFF;
      border-style    :outset;
      border-width    :0.05cm;
      margin-right    :-1cm;
    }.errormessage
    {
      background-color:#C6C6C6;
      font-size       :10pt;
    }.navigator
    {
      background-color: #BBBBBB;
    }.oddrow { background-color: #FFFFFF; }
    .evenrow { background-color: #CCDDFF; }.informationfield
    {
      background-color :#C6C6C6;
      border-style     :inset;
      border-color     :#DDDDDD;
      border-width     :0.02cm;
      vertical-align   :top;
    }.title
    {
      font-family :arial;
      font-size   :12pt;
      font-weight :bold;
      margin-left :0.1cm;
    }.navigationinfo
    {
      font-family   :sans-serif;
      font-size     :8pt;
      margin-top    :-0.4cm;
      margin-bottom :-0.1cm;
      margin-right  :0.1cm;
    }.navigationseparator
    {
      background-color:#C6C6C6;
    }.listtable
    {
      background-color :#D0D0D0;
      border-width: 0.05cm;
    }
    <!------------- Style Sheets for Tabs ------------->.tabie55bug
    {
      //EF: if this is removed, tabselected no longer works in IE5.5...
    }.tabselected
    {
      background-color    :#E0E0E0;
      border-style        :outset;
      border-color        :#FFFFFF;
      border-width        :0.05cm;
      border-bottom-width :0cm;
      padding-bottom      :0.05cm;
      padding-top         :0cm;
      width               :95%;
      font-size           :10pt;
      font-family         :Arial, Helvetica, sans-serif;
      font-weight         :bold;
      z-index             :3;
    }.tabunselected
    {
      background-color    :#BBBBBB;
      border-style        :outset;
      border-color        :#FFFFFF;
      border-width        :0.05cm;
      border-bottom-width :0cm;
      width               :95%;
      font-size           :10pt;
      font-family         :Arial, Helvetica, sans-serif;
      font-weight         :bold;
      z-index             :3;
    }.tabbody
    {
      background-color :#E0E0E0;
      position         :absolute;
      visibility       :hidden;
      font-family      :Arial, Helvetica, sans-serif;
      font-size        :10pt;
      font-weight      :bold;
      z-index          :3;
      border-color     :#FFFFFF;
      border-style     :outset;
      border-width     :0.05cm;
      height           :50px;
      width            :300px;
      padding-left     :0.4cm;
      padding-right    :0.4cm;
    }
      

  2.   


    //------------------------------------------------------------------------
    // determine browser
    //------------------------------------------------------------------------function Browser()
    {
      var b = navigator.appName;
      var vi = parseInt(navigator.appVersion);  if (b == "Netscape" && vi >= 4) this.isNS = true;
      else if (navigator.userAgent.indexOf("Opera") > 0) b = navigator.userAgent;
      else if (b == "Microsoft Internet Explorer" && vi >= 4) this.isIE = true;  if (!this.isNS && !this.isIE) alert("Browser " + b + " not supported");
    }var browser = new Browser();//------------------------------------------------------------------------
    // layers...
    //------------------------------------------------------------------------// Create a Layer with HTML-Content at Position (x,y) without
    // Searching for a <div>-Tag
    function createLayer(name, html, left, top)        //不通过寻找<div>-Tag创建layer
    {
       if (browser.isIE)
      {
        var str = '\n<div id='+name+' style="position:absolute; left:'+left+'; top:'+top+'; width:2pt; height:1pt; visibility:show;z-index=4;">'
        str = str + html + '</div>'
        document.body.insertAdjacentHTML("BeforeEnd",str)
        return getLayer(name)
      }
    }// Write new HTML-Content into a Layer
    function writeIntoLayer(layer, html)
    {
       if (browser.isIE)
      {
        layer.innerHTML=html;
      }
    }// Getting the Width of a Layer
    function getWidth(layer)
    {
      if (browser.isIE)
          return(layer.clientWidth);
      return(-1);
    }// Getting the Height of a Layer
    function getHeight(layer)
    {
      if (browser.isIE)
          return(layer.clientHeight);
      return(-1);
    }// Move Layer at X/Y Position.
    function moveLayerTo(layer, x, y)
    {
      if (browser.isIE)
      {
        layer.style.left = x;
        layer.style.top  = y;
      }
    }// Set the Background Color of a Layer with the specified Color
    function setBgColor(layer, color)
    {
      if (browser.isIE)
        layer.style.backgroundColor = color;
    }// Function for initialising a certain Layer.
    function getLayer(name)
    {
      if (browser.isIE)
        return document.all(name);
      return null;
    }// Function for initializing a certain Layer (only for NETSCAPE).
    // Used by getLayer(name) above.
    function findLayer(name, doc)
    {
      var i, layer;
      for (i = 0; i < doc.layers.length; i++)
      {
        layer = doc.layers[i];
        if (layer.name == name)
          return layer;
        if (layer.document.layers.length > 0)
        {
          layer = findLayer(name, layer.document);
          if (layer != null)
            return layer;
        }
      }
      return null;
    }// Make a certain Layer visible.
    function showLayer(layer)                //显示对应的layer
    {
      if (browser.isIE)
        layer.style.visibility = "visible";
    }// Make a certain Layer invisible.
    function hideLayer(layer)               //隐藏目前的layer
    {
      if (browser.isIE)
        layer.style.visibility = "hidden";
    }
    // ------------------------------------------------------------ //
    // ----------------  Functions for Tabed Panes ---------------- //
    // ------------------------------------------------------------ ////EF: if this is removed, tabselected no longer works in IE...
    //var unselectedHeadIEBug = "";
    var unselectedHead = "<span class='tabunselected'><a href=\"javascript:showTab('{_Name_}');\"><nobr>&nbsp;{_Text_}&nbsp;</nobr></a></span>"
    var selectedHead   = "<span class='tabselected'><nobr>&nbsp;{_Text_}&nbsp;</nobr></span>"var layerHead = new Array()
    var layerBody = new Array()var selectedindex = 0
    var y_pos         = 110
    var x_pos         = 14
    var maxlength = 20  //Max. Length of a Tab//Initialisation of the Tabed Pane
    function initTabedPane(index)
    {
      var x = x_pos  for (var i = 0; i < tabtext.length; i++)   //数组(全部。)
      {
        var headcontent = unselectedHead
         
        headcontent = headcontent.replace("{_Name_}", tabid[i])
        
        headcontent = headcontent.replace("{_Text_}", tabtext[i].replace(/ /g, "&nbsp;"))    layerHead[i] = createLayer("Head"+i, headcontent, x, y_pos)    x += getWidth(layerHead[i])
        layerBody[i] = getLayer(tabid[i])
        moveLayerTo(layerBody[i], x_pos, y_pos+getHeight(layerHead[0]))
        maxlength = ( getHeight(layerBody[i])>maxlength ) ? getHeight(layerBody[i]) : maxlength
      }  //Correct the scrollable Screen Height
      if (browser.isIE)
        var resizelayer = createLayer("big","<br>",x,y_pos+getHeight(layerHead[0])+maxlength+10)  //Set Index of selected Tab
      selectedindex = index;
      showTab(tabid[selectedindex])   //显示"全部"页面的标签
    }//Change of selected Tab
    function showTab(id)             //根据所选的标签显示对应的页面
    {
      for (var ndx = 0; ndx < tabid.length; ++ndx)
        if (tabid[ndx] == id)
          break;  // Show selected Tab.
      hideLayer(layerBody[selectedindex])        //function
      showLayer(layerBody[ndx])                  //function   // Show colored Tab Head of selected Tab.
      var html = unselectedHead
      html = html.replace("{_Name_}", tabid[selectedindex])
      html = html.replace("{_Text_}", tabtext[selectedindex].replace(/ /g, "&nbsp;"))  writeIntoLayer( layerHead[selectedindex], html )  html = selectedHead
      html = html.replace("{_Text_}", tabtext[ndx].replace(/ /g, "&nbsp;"))  writeIntoLayer( layerHead[ndx], html )  selectedindex = ndx
    }
      

  3.   

    原因找到了,但是我忘了绝对定位的css语句了
    原因就是.tabbody
    {
      background-color :#E0E0E0;
      position         :absolute;  这里的问题
      visibility       :hidden;
      font-family      :Arial, Helvetica, sans-serif;
      font-size        :10pt;
      font-weight      :bold;
      z-index          :3;
      border-color     :#FFFFFF;
      border-style     :outset;
      border-width     :0.05cm;
      height           :50px;
      width            :300px;
      padding-left     :0.4cm;
      padding-right    :0.4cm;
    }只要把按钮的style设成绝对定位,高度在列表下就可以了
      

  4.   

    搞定了
    css加一个
    .button
    {
    position:absolute;
    top:300;}button使用<input type=button name="test" value="test" class="button">