Question

美好的一天......是的，我是一个nOOb。所以我为我的nOObness道歉。我搜索过这个网站，许多人喜欢它一周没有任何解决方案。我相信我的问题很独特。

我有一个大约有10页的网站，我创建的网页上有很多很多桌子。大多数表都以相同的方式格式化，所以我立即转到CSS以满足我的需求。

所以现在我正在尝试理解CSS和选择器以及如何组合它们等。

这是我的困境。我为<td>标签创建了一个标签样式，它对我正在做的所有事情的95％都有效。我还为那些实例创建了一个“覆盖”类，当我想左对齐并缩进<td>时：

TD {                
            text-align: center;
            vertical-align: middle;
            all other rules;}

td.overide_l {
            text-align: left;
            vertical-align: middle;
            padding-left: 1em;
            all other rules;}

我的问题来自一个公司控制的javascript，它创建了一个左手导航菜单。显然，该代码中存在受我的规则影响的td。问题是javascript不是我可以改变的东西。它是保存在公司网站上的公司脚本，但需要在我的每个页面上。

如果我将<td>样式更改为左对齐，则脚本将对齐到左侧。如果我一起移除<td>标记，它将与左侧对齐。如果我将<td>样式中心对齐，就像我想要的那样，脚本中心对齐左侧导航，我无法覆盖它。

我尝试了一千件事。我试图将脚本放在一个单独的表中，并在其中包含类覆盖，我尝试将其放在一个包围它的单独的td中，我已将class =“overide_l”类放在<span>中。

最后，我尝试创建{id}与其相关联的<div>，但是我的Class =“overide_l”（以及我创建的其他类型样式）在内部无效新的divs了......

div#content-section td {
            text-align: center;
            vertical-align: middle;}

最终我想要做的是保留标签样式，就像它在这篇文章的顶部一样，只需创建一个<div>或其他东西来关闭那个单件的<td>标签样式代码这甚至可能吗？

你能帮帮我吗？

Answer 1

您是否可以使用覆盖类对td选择器执行相同的操作？

#content-section td.overide_l {
  text-align: left;
  vertical-align: middle;
  padding-left: 1em;
}

问题是特异性：

ID选择器的100分
班级选择器的10分
1表示标签选择器

如果您添加选择器，您将获得优先选择的选择器。

在你的情况下：

td.overide_l = 11

div#content-section td = 102

所以第二次获胜。将td.overide_l更改为#content-section td.overide_l会使其111。

Answer 2

您需要做的是在您的css规则中更具体。将规则放在所有元素（td）上是一个坏主意，正是因为你在这里说明的原因。让代码中的表具有不同的类，以便CSS规则知道这些表与nav tds之间的区别。另外，如果你们这么多人都在使用桌子，那么你们的时间会很糟糕。

从外部源覆盖td标记样式

2 个答案: