css - 覆盖链接的 theroller 样式

Question

我正在尝试为特定链接覆盖 themeroller 的主题。

所有链接的代码是:

.ui-body-c .ui-link:link {
    color:      #000000      /*{c-body-link-color}*/;
    text-decoration: none !important;
}

.ui-body-c .ui-link:visited {
    color:      #000000      /*{c-body-link-visited}*/;
    text-decoration: none !important;
}

.ui-body-c .ui-link:active {
    color:      #000000      /*{c-body-link-active}*/;
    text-decoration: none !important;
}

.ui-body-c .ui-link:hover {
    color:      #00b2ef !important     /*{c-body-link-hover}*/;
    text-decoration: underline !important;
}

我创建了一个新链接，并希望它的 :link 颜色与其他链接不同。我添加了 .newlink 类，它是:

.newlink:link{
    color: #00b2ef
}

无论我将这个类放在哪里，或者如果我添加选择器(上面的其他 2 个类以及 .newlink 选择器或此链接的唯一 ID)，链接仍然继承 themeroller 样式。当我使用 Firebug 查看继承的样式时，我添加的任何样式总是被划掉。我认为将额外的类添加到选择器 (.ui-body-c .ui-link .newlink:link{...}) 会增加链接的规则权重，但这是行不通的。我将不胜感激任何帮助。谢谢大家!

Answer 1

你在增加重量的正确道路上你只需要删除 .ui-body-c .ui-link.newlink:link{...} 之间的空间来表示具有新链接类...

必须在下面添加以覆盖上面的代码。 (用户界面链接)

.ui-body-c .ui-link.newlink:link {
    color:      #000000      /*{c-body-link-color}*/;
    text-decoration: none;
}

除非您打算删除 ui-link 类...那么您需要重写 css... 也许是这样的:

.ui-body-c a.newlink:link {
    color:      #000000      /*{c-body-link-color}*/;
    text-decoration: none !important;
}

.ui-body-c a.newlink:visited {
    color:      #000000      /*{c-body-link-visited}*/;
    text-decoration: none !important;
}

.ui-body-c a.newlink:active {
    color:      #000000      /*{c-body-link-active}*/;
    text-decoration: none !important;
}

.ui-body-c a.newlink:hover {
    color:      #00b2ef !important;     /*{c-body-link-hover}*/
    text-decoration: underline !important;
}