jquery - 通过 "inline"与一些未知的 css-overriding 问题作斗争

Question

我最近遇到了一个 css-overriding 问题，原因是“未知”。

背景:

我构建了一个网站，其中包含一个包含三列的表格，中间列是在 openlayers 的帮助下构建的 map ，其他列仅显示 map /图层的一些信息。

问题:

在我使用 jQuery 设置弹出窗口以显示一些 map 信息之前，我已经控制了所有的 css。弹出窗口本身运行良好，但在弹出窗口显示的那一刻，整个表格的所有 css 样式都无故更改(例如表格的字体大小、text-aglin 等)。

当我检查哪个文档覆盖了我的 css 时，它显示 html 标签“tbody”将被“inline”更改，如下图所示:

但我的 html 中甚至没有 tbody 标签，我敢肯定，而且我也没有编写任何内联样式的 css，这可能就是原因。

原代码太长，贴不上来了，想问一下:

1. 在图片中，我试图通过给标签一个类来覆盖字体大小，调试工具显示我的 css 样式具有第一优先级，但字体大小仍然是 11.2px 不是我想要的定义为 14 像素。这怎么可能？

2. 即使我的 html 中也没有 tbody 标签。 tbody 标签将被设置为“Inline”，这里的 Inline 实际上是什么(如果我点击“inline”，它会显示 ol.css 并且它不包含任何有用的信息)，这怎么可能？

   <

Answer 1

这里有一些误解，我会尽力澄清。

1. 每个<table>这几天有个<tbody> ，即使您没有自己指定。意思是<table><tr>...</tr></table>变成 <table><tbody><tr>...</tr></tbody></table>在浏览器中。
2. tbody font-size style 是一种内联 样式，意思是类似tbody { font-size: 80% } 的东西不是在 .css 文件中声明，而是在页面本身中声明；或者在 <style></style>阻止或使用 <tbody style="font-size: 80%"> (但你说 <tbody> 不会出现在页面上)。