table 属性与另一个重叠 css

Question

我正在处理一个网页，该网页有一个 table，其中包含如下几列

在上图中，每个 td 都有蓝色边框，但我正在尝试使用以下标记和 CSS

增加 Ask1 左边框的厚度

HTML

 <td class="clientOffer1">Ask1</td>

CSS

clientOffer1 {
 border-left: 3px solid #0088cc;

}

但上面的 CSS 被 td 的原始 css 替换，用于剩余的列，如下所示

td {
    padding: 1px;
    line-height: 10px;
    text-align: center;
    /*background-color:#3C78B5;*/
    vertical-align: auto;
    border: 1px solid #0088cc;
    width: 120px; 

}

如何使用两者 CSS 而不相互冲突？

Answer 1

类被选为 CSS:

.clientOffer1 { ... }

DEMO

td {
    padding: 1px;
    line-height: 10px;
    text-align: center;
    /*background-color:#3C78B5;*/
    vertical-align: auto;
    border: 1px solid #0088cc;
    width: 120px; 
}

.clientOffer1 {
    border-left: 3px solid #0088cc;
}

如果您仍然遇到问题，那是因为某种程度的特异性正在发生。尝试以下操作：

.client {
  border-left: 3px solid #0088cc !important;
}

这里有一些读物material：

Specificity

table 属性与另一个重叠 css

overlapping css of a table property with another

html

css

html-table

table 属性 与另一个重叠 css

overlapping css of a table property with another

html

css

html-table

table 属性与另一个重叠 css