表格单元格中的百分比宽度如何在HTML中工作？

我一直想知道很长时间，表格单元格中的百分比宽度如何在HTML中工作。表格单元格中的百分比宽度如何在HTML中工作？

情况1：无表宽度指定，单列和列没有给予充分的空间

<table> 
    <tr> 
     <td width="25%">mango</td> 
     <td width="25%"">apple</td> 
    </tr> 
</table>

情况2：未指定表格的宽度，单列和列被给予了充分的空间

<table> 
    <tr> 
     <td width="50%">mango</td> 
     <td width="50%"">apple</td> 
    </tr> 
</table>

案例3：未指定表格宽度，单行和列给出超过100％的空间

<table> 
    <tr> 
     <td width="50%">mango</td> 
     <td width="50%"">apple</td> 
     <td widht="100%">guava</td> 
    </tr> 
</table>

案例4：没有指定表格的宽度，指定了多个行和列给予以下比例的配置

<table> 
    <tr> 
     <td width="33%">mango</td> 
     <td width="33%"">apple</td> 
     <td widht="33%">guava</td> 
    </tr> 
    <tr> 
     <td width="50%">papaya</td> 
     <td width="50%">pomengrante</td> 
    </tr> 
</table>

其输出我不能关联，请帮我在这

来源

2016-08-07 Rishab Shinghal

什么是真正的问题吗？你有这样的情况，但是当你尝试他们发生了什么，和你有什么期望吗？ –

这些都给人很怪异的输出，可你只是单独运行并查看。像情况1：我无法分析，在哪方面它将需要25％，它是整个空间的25％还是别的什么。 –

单元格将与其表格相关联，但它们需要占用表格宽度的100％。所以这让你的case1不起作用。它会将其分成50％。但是你设置这个的情况会起作用，因为它是表格宽度的100％。

Demo

<table> 
    <tr> 
     <td width="20%">mango</td> 
     <td width="80%">apple</td> 
    </tr> 
</table>

如果你需要的东西占用25-25，那么也许你应该考虑使用的div来代替。

此外，您的最后一种情况将无法正常工作，因为您需要在表中具有相同数量的单元格。

来源

2016-08-07 14:56:00

百分比将工作取决于任何屏幕分辨率等于100％因此，您将百分比分配给您的要求测量百分比示例如下所示，（表中tr宽度（100％）=（td（宽度））

 <table style="width:100%;" border="1"> 
 
     <tr> 
 
     <td wdith="50%">Mango</td> 
 
     <td wdith="50%">Lemon</td> 
 
     </tr> 
 
    <!--You Given For 1st Record measurements Then Automatically Adjested 2nd Record Also Depend Upon 1st Record--> 
 
     <tr> 
 
     <td>some Item</td> 
 
     <td>some Item</td> 
 
    </tr> 
 
    </table> 
 
     <!--This Is Another Type Of Table--> 
 
     <h3>This Is Another Type Of Table</h3> 
 
     <table style="width:100%;" border="1"> 
 
     <tr> 
 
     <td wdith="33%">Mango</td> 
 
     <td wdith="34%">Lemon</td> 
 
     <td wdith="33%">Something</td> 
 
     </tr> 
 
    <!--You Given For 1st Record measurements Then Automatically Adjested 2nd Record Also Depend Upon 1st Record--> 
 
     <tr> 
 
     <td>some Item</td> 
 
     <td>some Item</td><td>some Item</td> 
 
     </tr> 
 
     </table> 
 
     <h3>This Is Another Type Of Table</h3> 
 
     <table style="width:100%;" border="1"> 
 
     <tr> 
 
     <td wdith="25%">Mango</td> 
 
     <td wdith="25%">Lemon</td> 
 
     <td wdith="25%">Something</td> 
 
     <td wdith="25%">Something</td> 
 
     </tr> 
 
     <!--You Given For 1st Record measurements Then Automatically Adjested 2nd Record Also Depend Upon 1st Record--> 
 
     <tr> 
 
     <td>some Item</td> 
 
    <td>some Item</td> 
 
    <td>some Item</td> 
 
    <td>some Item</td> 
 
    </tr> 
 
    </table>

来源

2016-08-08 04:37:53

表格单元格中的百分比宽度如何在HTML中工作？

回答

相关问题