配置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和tr設置樣式。 您還需要相應地調整font-size ，以使每個單元格中的文本正確適合。 現在，該表已應用了一些CSS，但其中的標簽正在使用其默認值。