Html 如何更改CSS应用顺序

请参见下面的屏幕抓图，我想将

.navbar account>li>设为活动帐户。但是默认情况下，它是禁用的，并且活动的一个是
.navbar default.navbar nav>li>a
。因此，我的字体颜色不会变为红色。我不能放
！重要信息
，因为它会影响其他页面。因此，我想在
滑入菜单.css
中启用
.navbar account>li>a

只需在特定页面中重新定义该样式：

 <style>
        .navbar-default .navbar-nav>li>a { . . .}
 </style>


.navbar默认值.navbar nav>li>a{…}

本地页面样式将替代链接页面样式，但仅影响一个页面

顺便说一下，这里有一个很好的资源来确定哪个选择器比另一个选择器更具体：
如果您可以在“slided-in-menu.CSS”中自由更改CSS，那么下面的代码说明了在同一CSS文件中的修改（考虑到您现有的HTML DOM和应用的类）：

说明：

CSS遵循一个层次结构，在该层次结构中应用了以前应用的CSS，因为“.navbar default”是父级，然后它会转到子级，因为“.navbar nav”是它的子级。因为它包含两个类，所以它具有更高的优先级，而在后一个类中，css应用了“.navbar account”，它的优先级低于另一个类

使用以下样式：

.navbar-account>li>a:first-child{
     color:#E84c4c;
}

在这种情况下，bootstrap.min.css文件中的选择器比slide-In-menu.css中的选择器具有更高的特异性，因此该选择器获胜

特异性是一个非常重要的事情，因为我们总是可以让同一个元素被多个选择器（如本例中）作为目标，在这种情况下，用户代理使用选择器的特异性来确定哪一个最终会赢得并应用于该元素

根据：

选择器的特异性计算如下：


如果声明来自，则计数1是一个“样式”属性，而不是一个带选择器的规则，否则为0（=a）（在HTML中，元素“样式”属性的值是样式表规则。这些规则没有选择器，因此a=1、b=0、c=0和d=0。）
计算选择器中ID属性的数量（=b）
计算选择器中其他属性和伪类的数量（=c）
计算选择器中元素名称和伪元素的数量（=d）

特异性仅基于选择器的形式。特别是，形式为“[id=p33]”的选择器被计为属性选择器（a=0，b=0，c=1，d=0），即使id属性在源文档的DTD中定义为“id”

将四个数字a-b-c-d（在基数较大的数字系统中）串联在一起，给出了特殊性

对于选择器
.navbar default.navbar nav>li>a
，其特殊性为022，因为它包含两个类选择器和两个元素类型（
li
，
a
）选择器

而选择器
.navbar account>li>a
的特异性仅为021，因为它只有一个类选择器和两个元素类型选择器作为其一部分

因此，覆盖引导选择器中指定的属性的关键是使用比引导选择器更具体的选择器。如果我们将选择器更改为
body.navbar default.navbar account>li a
，选择器的特异性将变为023（高于引导选择器），因为现在它有2个类选择器和3个元素类型选择器，因此它获胜

以这种方式更改选择器不会在其他地方导致任何其他问题，因为
body
始终是所有元素的父元素，而
的父元素是
.navbar account

注意：我们也可以使用
.navbar default.navbar account>li a
（不带
主体
），但其特殊性为022，与引导选择器相同，因此不能保证它始终得到应用。（这是在我看到之前写的。如果slide-in-menu.css总是在bootstrap.min.css之后加载，那么仅此一项就足够了。）

另外，正如我在对的评论中提到的，如果您希望引导样式只覆盖一个页面，那么他的答案是最好的方法。我在回答中提到的方法将覆盖所有页面

  .navbar-account > li > a:active{
    #give your style
    }


您可以使用此按钮在活动、悬停、聚焦上显示您的样式
 您可以在
bootstrap.min.css
之后加载
slide-in menu.css
。经典的破解方法（不推荐）是
.navbar-account.navbar-account>li>a
。第一条注释中提到的方法（或者）增加slide-in-menu.css中选择器的特异性（比如
body.navbar default.navbar account>li>a
。你不能修改那个文件的内容吗？@sumneevans是的，它已经在
bootstrap.min.css
@Harry之后了。这个很好用。你能告诉我怎么读吗？有时我看到像是在没有空间的情况下写多个选择器。比如
body.navbar-default.navbar-account>li>a
没问题@Harry，我已经看完了你的答案，它确实包含了比我的答案多得多的信息。请投票支持我的答案。快乐的编码朋友。你也有一个正确的观点。如果它仅为该页面覆盖引导css，那么将其放入该页面的
标记中年龄更有意义。投票结果：）@Harry这就是我们使用页面级样式表的全部原因。提供特定于页面的指令，这些指令应该覆盖外部样式表中的类似指令。我认为上面的所有答案都不正确，因为它们会影响所有页面，OP说他不希望这样。不，OP并不是真的说他们只想影响一个页面我是这么说的
  .navbar-account > li > a:active{
    #give your style
    }