Question

我需要使用自己的CSS覆盖应用程序的主要CSS。这样做有好办法吗？一种方法是！important标签，我想避免。

我只是在考虑是否可以创建自定义CSS媒体并为该特定媒体定义我的CSS。这样我可以为我的自定义媒体定义主应用程序CSS。

Answer 1

如果您使用相同的选择器，CSS将覆盖自身，因此您不需要！important。

所以：

.my-div .my-span {
    color: green;
}

将被覆盖：

.my-div .my-span {
    color: red;
}

但不是：

.my-span {
    color: red;
}

是的，您可以使用媒体查询来定位特定的屏幕尺寸。比如：

@media screen and (device-width: 360px) and (device-height: 640px)

Answer 2

Cascading 样式表的主要“特征”是它的级联效应。

互联网上许多地方的修改引用：

Cascade是特殊部分。样式表旨在级联通过一系列的风格规则，如瀑布河。该河里的水击中了瀑布里的所有岩石，但只有底部的那些影响水流动的确切位置。相同样式表中的级联是正确的。

因此，只要您指定完全相同的规则但更改这些规则中的某些属性值，并确保它们在原始规则之后加载，它们将覆盖之前指定的属性值那些规则。如果您跳过新规则中的属性值，则先前指定的属性值将对该属性保持有效。

Media queries是为特定类型的媒体定义样式的最佳答案。它允许您专门为特定屏幕尺寸指定规则。

如果通过查询屏幕大小无法正确识别您的特定目标媒体，但需要识别JavaScript。您可以编写一些JavaScript，在加载文档时加载样式表，在这种情况下，您只需要确保它在原始样式表之后加载，然后它将覆盖具有相同特异性的样式。