将 CSS 导入 HTML 不起作用答案

【问题标题】：importing CSS into a HTML does not work将 CSS 导入 HTML 不起作用
【发布时间】：2018-09-15 06:02:43
【问题描述】：

我正在尝试将 CSS 文件 @import 到 HTML 中，但它不起作用。我确实尝试过链接路径，它也不起作用。

<!DOCTYPE html>
<html lang="en">
<head>
<title>Lesson</title>
<meta charset="utf-8">
<style rel="stylesheet">
@import url("U5.css");
</style>
</head>
<body>

<script src="assets/script/U5.js" ></script>

</body>

但这种格式似乎是 "http:....." ;

U5-LättJS

href="http://127.0.0.1:54149/assets/pages/U5-JS.html"

我可以将路径转换为 http 以便它可以工作吗？谢谢。

click for validated code picture

【问题讨论】：

为什么不直接使用为此设计的html标签呢？ <link rel="stylesheet" href="U5.css">
我做了@BalázsVarga 但它也不起作用。

标签： html css import styles

【解决方案1】：

是的！我终于找到了如何做到这一点。我只是复制了 HTML 路径并将其写为样式路径。 HTML 示例；

href="http://127.0.0.1:54149/assets/pages/U5-JS.html"

所以这是更改后的样式标签；

href=''http://127.0.0.1:54149/assets/style/U5.css''

所以它完美地工作。我仍然不知道出了什么问题。再次感谢所有努力的人，我很感激。

【讨论】：

【解决方案2】：

文档：

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/style

https://developer.mozilla.org/en-US/docs/Web/CSS/@import

<!DOCTYPE html>
<html lang="en">
<head>
<title>Lesson</title>
<meta charset="utf-8">
<style>
   @import url("./FILE.css");
</style>
</head>
<body>

<script src="assets/script/U5.js" ></script>

</body>
</html>

【讨论】：

【解决方案3】：

如果您的 CSS 文件位于同一目录中，请使用：

<link rel="stylesheet" type="text/css" href="./U5.css">

如果此 HTML 文件位于根目录下，请使用：

<link rel="stylesheet" type="text/css" href="/assets/pages/U5.css">

使用https://www.w3schools.com/Tags/tag_link.asp 获取有关链接到外部样式表的更多信息

【讨论】：