CSS 个样式表被覆盖，即使它在最后一个序列中

Question

这是我的主要 jsp 文件的一些代码：

<link rel="stylesheet" type="text/css" href="<c:url value='/styles/bootstrap.min'/>,bootstrap-switch.min.css" />
<link rel="stylesheet" type="text/css" media="screen" href="<c:url value='/styles/main.css'/>"/>

main.css 在 bootstrap css 之后的行，所以通常 main.css 会覆盖 bootstrap css。（如果我错了请纠正我。）

在 main.css 中，我创建了 1 class 如下：

.testjx{
    background-color: yellow;
    vertical-align:middle;
}

这是我的子 jsp 文件：

<td class="testjx">
     1000000
</td>

当我在浏览器中查看页面时，我发现 vertical-align:middle 被 bootstrap css 文件覆盖，如下图所示：

我尽力找出根本原因，但失败了。请指教。

Answer 1

你必须这样做：

table tr td.testjx, table tfoot tr td.testjx, table thead tr td.testjx, table tbody tr td.testjx{
    vertical-align:middle;
}

You need to inspect where the class is to short the css code...check if is on the tfoot, thead or tbody or general

DEMO HERE

Answer 2

我通过将 !important 添加到相关的 CSS 即 font-weight:bold !important; 来解决这个问题，这将阻止它被覆盖，无论它在哪个文件中。简单。

CSS 个样式表被覆盖，即使它在最后一个序列中

CSS stylesheets being override even it is in last sequence

html

css

jsp

vertical-alignment

twitter-bootstrap