在表格内显示表格标题标签

Question

我正在尝试使表格的边框和背景围绕标题标签，而不是出于可访问性原因而将其排除在外。我是要显示类似th标签的。

我尝试添加和删除边框，但是边框和背景样式位于我不想更改（或重复）的样式表中，因此具有挑战性。

<table class="border-background-stylesheet">
<caption>Caption</caption>
<tr><th colspan="2">What I want caption to look like</th></tr>
<tr><td>Data cell</td><td>Data cell</td></tr>
</table>

示例：

.border-background-stylesheet {
  border:#222222;
  background:#00EE00;
}

    <table class="border-background-stylesheet">
    <caption>Caption</caption>
    <tr><th colspan="100">What I want caption to look like</th></tr>
    <tr><td>Data cell</td><td>Data cell</td></tr>
    </table>

Answer 1

这似乎满足要求：

基本上，将整个表格边框，然后从顶部将其删除。 接下来，为整个标题加上边框，然后从底部将其删除。

结果？两个块仅显示为一个。

.border-background-stylesheet
{
	background:#00EE00;
	border: solid 1px black;
	border-top: none;
}

caption
{
	background:#00EE00;
	border: solid 1px black;
	border-bottom: none;
}

<table class="border-background-stylesheet">
<caption>Caption</caption>
<tr><th>What I want caption to look like</tr></th>
</table>