外部样式表覆盖内部样式表，即使使用相同的选择器
External stylesheets are overriding internal, even with the same selector
我有 2 个页面（SignIn 和 PasswordReset）和一个外部 CSS 文件（名为 MainStyleSheet.css）。我的页面中有一些 HTML 元素，它们都有一个 class（名为 ab-control-container）。
在这两个页面中，我需要覆盖 class ab-control-container.
的一些样式表
令我困惑的问题是，在第一页（SignIn）中，内部样式表覆盖了外部样式表，但在第二页（PasswordReset）中，那些内部样式表与第一页的样式表不会覆盖外部样式表。
这是 Chrome 检查元素工具显示的内容：
第一页：
第二页：!
问题是什么？为什么？
internal stylesheets are overriding the external as I excepted
<style> 元素在级联中的优先级不高于 <link>ed 样式表。
您可能会对 style 属性（比任何规则集都具有更高的特异性）感到困惑。
当两个规则集的选择器具有相同的特异性时（这些确实如此，它们的选择器是完全相同的！）然后 later 将覆盖 earlier一个。
您需要更改样式表的加载顺序或选择器的特性。
有关详细信息，请参阅 the cascade。
似乎 PasswordReset 在代码（第 19 行）中的内部 CSS 比 SignIn（第 621 行）早得多。由此我假设外部样式表在这些位置之间的某处被引用，这产生了不同的规则顺序（后面的规则覆盖前面的规则）。
将 PasswordReset 中的内部 CSS 向下移动到引用外部样式表的行下方，这应该可以修复它。
我有 2 个页面（SignIn 和 PasswordReset）和一个外部 CSS 文件（名为 MainStyleSheet.css）。我的页面中有一些 HTML 元素，它们都有一个 class（名为 ab-control-container）。
在这两个页面中，我需要覆盖 class ab-control-container.
令我困惑的问题是，在第一页（SignIn）中，内部样式表覆盖了外部样式表，但在第二页（PasswordReset）中，那些内部样式表与第一页的样式表不会覆盖外部样式表。
这是 Chrome 检查元素工具显示的内容： 第一页：
internal stylesheets are overriding the external as I excepted
<style> 元素在级联中的优先级不高于 <link>ed 样式表。
您可能会对 style 属性（比任何规则集都具有更高的特异性）感到困惑。
当两个规则集的选择器具有相同的特异性时（这些确实如此，它们的选择器是完全相同的！）然后 later 将覆盖 earlier一个。
您需要更改样式表的加载顺序或选择器的特性。
有关详细信息，请参阅 the cascade。
似乎 PasswordReset 在代码（第 19 行）中的内部 CSS 比 SignIn（第 621 行）早得多。由此我假设外部样式表在这些位置之间的某处被引用，这产生了不同的规则顺序（后面的规则覆盖前面的规则）。
将 PasswordReset 中的内部 CSS 向下移动到引用外部样式表的行下方，这应该可以修复它。