我认为桌子比较容易做饭,但是这个打起了我的头.问题是宽度100％的表不填充它的父div.
<div style="width:100%; margin-top:20px;">
<div style="width:100%; padding:5px; background:#ccc; font-weight:900;">Table Top</div>
<table width="100%" border="0" cellspacing="0" cellpadding="5" style="border:1px solid #aaa;">
<tr style="background:#eee;">
<td> </td>
<td><strong>L</strong></td>
<td><strong>B</strong></td>
<td><strong>H</strong></td>
<td><strong>W</strong></td>
</tr>
<tr style="background:#fafafa;">
<td style="border:1px solid #ccc; border-width:1px 1px 0 0;">
Unit 1
</td>
<td style="border:1px solid #ccc; border-width:1px 1px 0 0;">
550 mm
</td>
<td style="border:1px solid #ccc; border-width:1px 1px 0 0;">
550 mm
</td>
<td style="border:1px solid #ccc; border-width:1px 1px 0 0;">
25 mm
</td>
<td style="border:1px solid #ccc; border-width:1px 0 0 0;">
60.00 kg
</td>
</tr>
</table>
</div>
但输出是这样的：
桌子没有填满div.可能是什么问题呢？
感谢任何帮助.
解决方法
标题div的宽度为100％,填充为5px,使其扩展到其极限.
为什么不使用表的整体呢？
为什么不使用表的整体呢？
这是一个工作版本：
<div style="width:100%; margin-top:20px;">
<div style="width:100%; background:#ccc; font-weight:900;"><div style="padding:5px;">Table Top</div></div>
<table width="100%" border="0" cellspacing="0" cellpadding="5" style="border:1px solid #aaa;">
<tr style="background:#eee;">
<td> </td>
<td><strong>L</strong></td>
<td><strong>B</strong></td>
<td><strong>H</strong></td>
<td><strong>W</strong></td>
</tr>
<tr style="background:#fafafa;">
<td style="border:1px solid #ccc; border-width:1px 1px 0 0;">
Unit 1
</td>
<td style="border:1px solid #ccc; border-width:1px 1px 0 0;">
550 mm
</td>
<td style="border:1px solid #ccc; border-width:1px 1px 0 0;">
550 mm
</td>
<td style="border:1px solid #ccc; border-width:1px 1px 0 0;">
25 mm
</td>
<td style="border:1px solid #ccc; border-width:1px 0 0 0;">
60.00 kg
</td>
</tr>
</table>
原文地址：https://www.jb51.cc/html/224573.html
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
