Question

我想在页面加载时将CSS应用于某些链接按钮，但其中一个<a id="lb1">logoff</a>必须保持其样式，没有悬停或其他事件必须更改其样式。

链接按钮没有类，并且所有这些都应用于标记的css，这样：

a
{
 //style
}

a:hover
{
  // style
}

有可能吗？

Answer 1

不，你不能。

您可以使用更具体的选择器（甚至是带有style属性的内联CSS），以便它们不太可能被意外覆盖。

你可以使用!important的（eugh）大锤，这样他们只会被另一个!important规则覆盖。

但是没有办法阻止它们被覆盖。

Answer 2

请在请尽可能避免使用!important。使用它会遇到许多恼人的问题和问题。我认为这是一个非常懒惰的黑客。

您要做的是将一个类附加到您不想覆盖的链接。类比一般选择器具有更高的优先级（例如a，p，b）。因此，如果您将此类附加到链接，CSS将覆盖您为a设置的默认CSS。

CSS：

a {
color: red;
}
a:hover {
color: blue;
}
.derp:hover { /*you can add everything you want to preserve here, essentially make it the same as the link css. you can also change it to #lbl:hover, although there's no good reason to be using an ID as a CSS selector*/
color: red;
}

HTML：

<a href="#">this will turn blue on hover</a>

<a class="derp" href="#">this will stay red on hover</a>

这是向你展示的小提琴。第二个链接附加了一个类，用于保留原始样式：http://jsfiddle.net/p6QWq/

Answer 3

为什么不在您想要更改的所有链接按钮上添加class，而不是将其添加到您不想更改的链接按钮。

然后你可以打电话：

  $(".myClass").css("backgound-color", "blue");

这会将类myClass的每个元素的背景颜色更改为蓝色背景。

或者您可以将全新的类添加到类myClass的链接按钮：

  $(".myClass").addClass("myExtraClass");

然后，这会生成链接按钮class

class="myclass myExtraClass"

Answer 4

看到您发布的代码会让您更清楚自己想要做什么。试试这个：

a {
    text-decoration: none;
    color: orange;
}
a:hover {
    text-decoration: underline;
    color: blue;
}

这会将默认样式应用于所有<a>元素。现在，您可以通过为锚点提供具有上述ID的特定样式来覆盖此默认样式：

#lb1 {
    color: black;
    text-decoration: none;
}
#lb1:hover {
    color: black;
    text-decoration: none;
}

我在一个快速而肮脏的jsFiddle中嘲笑了这件事。看看这是否能为您提供所需的结果。 ID优先于类和默认元素样式。因此，如果您想要保持相同，请相应地应用ID和ID并设置特定元素的样式。这也可以帮助您防止必须将类应用于多个元素。应用一个ID的代码少于应用十二个类的编码。（只是一个夸张的例子。我不知道你有多少链接。）

希望这有帮助。

Answer 5

根据定义，

css 级联，因此您应用于代码的任何样式都将应用于此特定样式，除非您覆盖它。

您必须为所有其他按钮指定一个类，或者覆盖此特定按钮的所有默认属性。

另外，不要忘记伪类：visited和：active。

Answer 6

你应该在你的css中使用!important，如：

a {
    /* style */
    background: #FFF !important;
}

a:hover {
    /* style */
    background: #FFF !important;
}

Answer 7

你总是可以通过简单地创建另一个样式表来覆盖你的css，并将它放在你html头部的样式表链接的结尾处。

<head>
    <link rel="stylesheet" href="location/location/first_stylesheet.css">
    <link rel="stylesheet" href="location/location/revised_stylesheet.css">
</head>

然而，这不是覆盖你的css最有效的方法;一个人建议通过简单地附加带有class属性的元素来消除这个单独样式表的必要性。类attr将允许您修改基本的html元素，标签并覆盖最后一层以“统治所有”。享受！

我可以阻止CSS样式被覆盖吗？

7 个答案: