如何将表格边框与div边框对齐

Question

我正试图让桌子上的黑条一直延伸到div的黑色边框。我究竟做错了什么？我现在已经搞砸了一段时间了，它开始找我。 :(我已经包含了下面的所有CSS和HTML。希望有人可以帮我一个。提前谢谢！

<div style="background: #DCDCDC;border: 1px solid #000000;border-radius: 12px; vertical-align: top;width: 240px;height: 180px;">
  <table width="100%">
    <tr>
      <td bgcolor="#000000" height="15"></td>
    </tr>
    <tr>
      <td>f</td>
    </tr>
  </table>
</div>

Answer 1

您需要overflow: hidden隐藏父母之外的样式。

border-spacing: 0删除表格的默认间距。

＆＃13;

＆＃13;

* {
  margin: 0;
  padding: 0;
}

div {
  background: #DCDCDC;
  border: 1px solid #000000;
  border-radius: 12px;
  vertical-align: top;
  width: 240px;
  height: 180px;
  overflow: hidden;
}

table {
  border-spacing: 0;
  width: 100%; }

＆＃13;

<div>
  <table>
    <tr><td bgcolor="#000000" height="15"></td></tr>
    <tr><td>f</td></tr>
  </table>
</div>

＆＃13;

＆＃13;

＆＃13;