同一页面上有多个CSS样式

Question

想象一下这种情况：

我有2个样式表。一个是全局样式表。另一种是特定于页面的样式。它们各自修改了类.tobestyled，但是以不同的方式，即全局表示隐藏类，而特定于页面的表示要显示它。

如何在特定于页面的样式表中使样式覆盖全局样式？

Answer 1

在全局样式表之后导入特定于页面的样式表，应该这样做。

<link rel="stylesheet" media="screen" href="global.css" />
<link rel="stylesheet" media="screen" href="page-specific.css" />

如果由于某种原因，样式不正确替换，请在要强制的行之后添加!important子句，例如：

.tobestyled {
    background-color: white !important;
}