css - css“onclick”伪效果问题

Question

使用完全相同的 CSS，

onclick 伪效果与此代码在同一站点的一页上可以正常工作：

<a data-url="#" class="btn btn-share referral_button">Button Text</a>

（但不可否认，它位于具有不同 div 的不同页面上）

但不是在另一个页面上，其中代码是：

<a data-url="#" class="btn btn-share referral_button" onclick="javascript:$find('ABC').set_activeTabIndex(3);">Button Text</a>

而不是表现出它应该在单击时收缩 - 并且有点恢复到没有任何 css 样式的外观 - 或者至少不是正确的 css 样式

我最初认为这与 onclick="javascript... 东西以某种方式发生冲突/覆盖并影响 CSS 执行应有的方式有关，但是* 编辑不可能是这样，因为我刚刚删除了整个 onclick 部分并且问题仍然存在:( * *

所以它必须是别的东西..

相关的 CSS 在这里：对不起，它很长而且可能臃肿。我认为最相关的东西在底部......

score 0 · Accepted Answer

最明显的建议是这个神秘的“其他”页面上有一些东西，它覆盖了样式。

使用 Firebug for Firefox 之类的工具来检查元素及其样式，这可能会提示您什么覆盖了您所期望的行为。

如果您不使用通用 CSS 文件，还要检查两个页面上的 CSS 是否相同。

阅读CSS Specificity，这可能是您问题的根本原因。这可以帮助解释为什么 styleb是 overiding style a。

归结为两页上的一些差异。

score 0 · Accepted Answer

看到它是一个无效的语法，我会说从你的所有:activeand.active语句中删除“\9”

如下所示：
.btn.active{background-color:#cccccc \9;}

编辑：此外，（与答案无关）
您的 CSS 是一团糟。（无意冒犯）
您可以轻松地清理它并使其更易于管理。
另外，它可能只是我疲倦的眼睛，但它的一半似乎只是重复和/或覆盖另一半（这可以追溯到清理它并使其易于管理）。

不过，老实说，你就是在做它的人，所以只要你能阅读和使用它。各有各的。我更喜欢我的 CSS 在开发环境中的可读性。

2 回答 2