配置CSS的错误

Question

我正在尝试使用CSS和容器而没有成功，我想如果有人帮忙：

我正在尝试按照以下代码指定，表是可以实现40％的正文Container1 DIV的100％，问题是行和列，它们不遵循说明书

<div id="CamadaSuperior" >
<table id="tabela">     
   <tr>       
   <td></td>     
   <td></td>  
   <td></td>  
   <td></td>  
   <td></td>  
   <td></td>         
    </tr>
   </table>
</div> 


<div id="CamadaDoMeio" >  
CamadaDoMeio
</div>

<div id="CamadaInferior" > 

 <table class="TabelaDaCamadaInferior" border="1">
  <tr><td>Esquerda</td><td>Meio</td><td> Direita</td></tr>
  </table>
  </div>

  <div id="CamadaRodape" >

  </div>
 </body>

我的CSS是这样的：

html, body{  
  height: 100%;
  margin:0;
  padding:0; 
}

div{  
border:1px solid black; 
padding:0; 
}

#CamadaSuperior
{
    height: 40%;    
}
#CamadaDoMeio
{
    height: 10%;    
}
#CamadaInferior
{
    height: 40%;    
      padding:0; 
}
#CamadaRodape
{
    height: 10%;    
      padding:0; 
}

 #tabela{
     height:100%;
     table-layout: fixed;
     border-width:1px;
}

 #tabela tr{
     width:50%;
     height:100%;
     border-width:1px;
}

 #tabela tr td{
  width:100%;
   height:16.7%;
}   

 .TabelaDaCamadaInferior
    {
        height: 100%;   
        width: 100%
    }
    .TabelaDaCamadaInferior tr td 
    { 
        width:33%;
     }

但这就是表格行所发生的事情：

TD标签不起作用：

Answer 1

简而言之，就是使用像bootstrap这样的CSS框架，它可以在eclipse环境中使用，只需附加你需要的类就可以使它正确定位。点击此处的链接https://www.texniq.de/en/web-engineering-i/create-first-bootstrap-project

答案很长，你需要为每个td＆amp; tr的类具有您想要的宽度和高度。您还需要相应地调整font-size，以便每个单元格中的文本都能正确匹配。现在该表已应用了一些css，但其中的标签使用了它们的默认值。