HTML表格标题和表格总高度答案

【问题标题】：HTML table caption and total height of the tableHTML表格标题和表格总高度
【发布时间】：2019-02-07 22:27:27
【问题描述】：

我在 div 元素中有一个表格。 div 仅用作占位符（它具有“固定”位置和硬定义的大小/左/上）。表格有 100% 的宽度和高度（div）。

当我在表格中使用内部“标题”标签时，它似乎不包含在表格的总高度中。表格从底部开始超出 div。

没有标题一切正常（表格的位置/大小与 div 相同）：

--------<div>--------
| =<table>========= | 
| |                ||
| |                ||
| |                ||
| |================|| 
---------------------

有标题，它坏了（表格在 div 之外）：

--------<div>--------
|                   |
|  Caption (large)  |
|                   |
| =<table>========= | 
| |                ||
  |                |
  |                |
  |================|

我想要的是让表格的 div 高度减去标题的高度。

【问题讨论】：

Why does table-caption increase the height of the table?的可能重复

标签： html html-table

【解决方案1】：

尝试固定标题的宽度和高度，并将边距和内边距设置为 0。然后将表格高度 + 标题高度相加得到 div 高度。

【讨论】：

【解决方案2】：

将overflow: hidden; 添加到外部<div> - 只要您的 div 没有预定义的高度，它将导致所有内部元素都包含在 @ 的任何背景颜色/图像大小计算中987654323@.

【讨论】：