Css 如何让@import样式表覆盖主样式表？_Css

Css 如何让@import样式表覆盖主样式表？

css

Css 如何让@import样式表覆盖主样式表？,css,Css,我使用主样式表文件中的@import导入了另一个样式表。我希望在@import样式表中所做的更改覆盖主样式表。这可能吗？@import在第一个样式表末尾导入第二个样式表你把弄糊涂了！重要信息和@import如果您的第二个样式表使用相同的选择器，那么它应该毫无问题地覆盖第一个样式表 CSS有一个非常严格的优先顺序来决定应该使用哪种样式，但是如果所有其他样式都相同，并且两种样式具有完全相同的优先级别，那么它将使用最后指定的样式。这允许您稍后通过重复相同的选择器来覆盖样式唯一的例外是第一个样式被指

我使用主样式表文件中的

@import

导入了另一个样式表。我希望在

@import

样式表中所做的更改覆盖主样式表。这可能吗？

@import

在第一个样式表末尾导入第二个样式表

你把

弄糊涂了！重要信息

和

@import

如果您的第二个样式表使用相同的选择器，那么它应该毫无问题地覆盖第一个样式表

CSS有一个非常严格的优先顺序来决定应该使用哪种样式，但是如果所有其他样式都相同，并且两种样式具有完全相同的优先级别，那么它将使用最后指定的样式。这允许您稍后通过重复相同的选择器来覆盖样式

唯一的例外是第一个样式被指定为

！重要信息

。在这种情况下，覆盖它要困难得多。甚至将另一种样式指定为

！重要信息

可能并不总是有效（我见过在某些浏览器中有效，但在其他浏览器中无效的情况）

因此，如果前面的样式表使用了

！重要信息

则覆盖它时可能会遇到问题。但是如果不是，它应该相当简单。

如果您的目标是通过导入另一个样式表来覆盖样式，则应该使用优先顺序

<head>
    <title>Title</title>
    <link href="style.css" rel="stylesheet" type="text/css" />
    <link href="style-override.css" rel="stylesheet" type="text/css" />
</head>

另外，如果您希望从页面中删除所有样式，请使用css重置

<style type="text/css">
  @import url("style.css");
  @import url("reset.css");
  @import url("style-override.css");
</style>


@导入url（“style.css”）；
@导入url（“reset.css”）；
@导入url（“style override.css”）；

查看位于的CSS重置并将其添加到reset.CSS。

此解决方案非常适合我

复制main.css并将其重命名为style.css。在main.css中，删除全部和过去：

@import url("style.css");
@import url("style-override.css");

仅此而已。

您还可以使用更具体的类名-例如，如果您想更改

div#sample {
max-width: 75%;
}

css的新用途

body div#sample {
max-width: 75%;
}

请记住，资格过高的选择器不是最好的主意；）

在主样式表之后执行@import，你应该会很好，只是尝试了一下，现在它不再加载了。在最后添加@import，它不再加载css了。我不想用！重要的是，我必须这样做，因为我想改变的一切都必须有一个更简单的方法。

body div#sample {
max-width: 75%;
}