Bootstrap 4 CSS - 覆盖默认标题端：底部不起作用答案

【问题标题】：Bootstrap 4 CSS – Overriding default caption-side:bottom not workingBootstrap 4 CSS - 覆盖默认标题端：底部不起作用
【发布时间】：2019-07-07 17:22:58
【问题描述】：

我正在使用 Bootstrap 并试图将表格标题移回表格顶部，但遇到了奇怪的阻力。

在开发人员检查器中可以看到，风格胜过特异性。然而，标题顽固地留在桌子底下......嘲笑我。

当我第一次添加标题侧样式时，效果很好。在向表格添加了一些内容和更多样式之后，它不再这样做了。现在我已经把东西剥离到最简单的元素，但那个标题不会让步。

为什么检查员会显示“caption-side:top;”而显示器不同意并在底部拍它？

这是一个说明问题的简单笔。希望这是对某人的灌篮，因为我很困惑。

所有的 CSS：

.crtable{
caption-side: top;
}

https://codepen.io/halfacre/pen/KJBJqZ

【问题讨论】：

请注意，您可以使用Stack Snippets 在 Stack Overflow 上共享您的代码，而不仅仅是在外部站点上。

标签： html css twitter-bootstrap html-table

【解决方案1】：

您必须将caption-side 样式实现为caption。

(https://codepen.io/anon/pen/PVBLBB)

CSS

caption{
  color:red;
    caption-side: top;
}

【讨论】：

这看起来很直观，不是吗？你知道，我发誓它在桌子上工作......！一分钟...？如果不是这样，我可能最终会尝试这个。问题解决了。谢谢，德米特里。

【解决方案2】：

仔细检查表的标记。如果您的任何<td>、<tr> 或<th> 标记与<table> 标准标记不一致，则可能会导致此错误。至少我是这样的！

【讨论】：