gpt4 book ai didi

css - 用@import 覆盖 css 样式不起作用

转载 作者:技术小花猫 更新时间:2023-10-29 10:15:53 25 4
gpt4 key购买 nike

我见过一些关于用@import 覆盖样式的类似问题,人们建议将@import 放在底部,但这似乎在这里不起作用。

--- index.html ---
<head>
<link rel="stylesheet" href="style.css" />
</head>
<body>
This text should be green.
</body>

--- style.css ---
body {color: red;}
@import url('style-override.css');

--- style-override.css ---
body {color: green;}

上面的示例将输出红色 文本,而预期是绿色

  • 在 head 内的 style.css 之后声明 style-override.css 将解决问题,但我想在 css 文件使用@import。

  • 在 style-override.css 中添加 !important 也会得到预期的结果,但这不是它应该的工作方式。

谁能解释一下?

最佳答案

那是行不通的,因为在样式表内声明的任何导入规则都必须先于其他所有内容 - 否则,...好吧,它行不通 ;) 。

因此,您的 style.css 样式表中应该包含:

@import url('style-override.css');  
body {color: red;}

关于css - 用@import 覆盖 css 样式不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12330191/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com