Question

我桌上有两种类型的细胞。

第一类单元格的类名为“.top”

第二类型单元格的类名为“.top .selected”

我的问题是我必须删除第二类单元格中的border-top。

这是我的代码：但它不适用第二个代码。

第一类：

html body #ROOT tr.fare .top {
border-top: 3px solid #888888 !important;
}

第二种类型：

html body #ROOT tr.fare .top .selected{
border-top: none !important;
}

我无法从第一种类型中删除！important 标记。我想覆盖第一个属性并应用第二种类型的css。请指教我，如何强烈定位？

Answer 1

根据您的解释，听起来像所选的单元格都有顶级和选择的类。

在这种情况下，您的规则应如下所示：

html body #ROOT tr.fare .top.selected{ /* no space between top and selected */
    border-top: none;
}

这个空间有很大的不同。

.top .selected
{
  ...
}

上面的选择器意味着：选择所有选择了类名的元素，这些元素是具有类顶级元素的后代。

但是以下选择器

.top.selected
{
  ...
}

表示：选择已选择类的元素以及顶级的类名。

Answer 2

你应该在CSS中写这个：

html body #ROOT tr.fare .top.selected{
border-top: none !important;
}

删除.top和.selected

之间的空格

.top.selected =具有两个类

的元素

.top .selected = .top元素，其中包含.selected类的另一个元素。