Question

我尝试过这样做，但似乎只是被忽略了。我发现一些文章说如果你想这样做，那么你必须确保父对象也是100％。我有以下内容：

<html xmlns="http://www.w3.org/1999/xhtml">
  <head runat="server" style="height:100%">
    <title>Untitled Page</title>
    <asp:ContentPlaceHolder id="head" runat="server">
    </asp:ContentPlaceHolder>
    <style type="text/css">
      .MasterStyle
      {
          width: 98%;            
          height: 100%;
      }
      .ContentStyle
      {         
          width: 100%;
      }
      .TableStyle
      {
          width: 133px;                     
          height: 100%;
      }
    </style>
 </head>
 <body class="MasterStyle">
    <form id="frmMaster" runat="server">
     <div class="ContentStyle">        
      <asp:Label runat="server" Text="My Site Name" Font-Bold="true" Font-Names="MS-Sans" 
            Style="text-align:right" Width="100%" />
      <br />        
    </div>
    <hr />
    <table style="width:100%; height:100%" border="true">
      <tr>
        <td class="TableStyle" style="height:100%">

桌子周围有一个边框，可以看到它没有填满高度。谁能告诉我为什么我没有达到100％的高度？

Answer 1

我相信这也取决于浏览器，实现方式有所不同...... 但请尝试将<html>设置为100％的高度，因为它是围绕<body>的元素。层次结构为html＆gt; body＆gt; table，如果最外面的元素未设置为100％，则内部元素不能变得更大。

修改
仔细观察您的源代码，我相信您的表格实际上位于html＆gt; body＆gt; form＆gt; table，所以也许您需要将表单高度设置为100％。我注意到您的<head>设置为100％，最好将其删除，因为<head>不是表格层次结构的一部分。你永远不会如何设置<head>的高度可能会混淆渲染引擎......

Answer 2

查看此网站，希望它有所帮助： http://apptools.com/examples/tableheight.php

HTML设置表高度为100％

2 个答案: