我如何正确地将我的 css 和 html 文件链接在一起,检查元素说"ERR_FILE_NOT_FOUND"



我尝试了HTML中所有不加载CSS文件的方法,但它们似乎都不起作用。当我试图检查铬元素时,他们告诉我

"加载资源失败:net::ERR_FILE_NOT_FOUND"。

这是我的文件结构

C> DevProject>index.html
在我的index.html中有两个项目,一个是"索引",这是我的html文件夹,点击它打开网站。另一个项目"样式"是我的CSS文件,点击它可以打开代码为的记事本

这是代码

<!DOCTYPE html>
<html>
<head>
<title>Test Title</title>
<link href="/style.css/"type="text/css" rel="stylesheet">
</head>
<body>
<h1>H1 text</h1>
<p>I'm learning to code on Codecademy! My goals include:</p>
<ul>
<li>Goal 1</li>
<li>Goal 2</li>
<li>Goal 3</li>
</ul>
</body>
</html>

这是CSS代码

* {
font-family: Helvetica, Arial, sans-serif;
}

h1 {
color: SeaGreen;
}

p, 
li {
font-size: 18px;
}

a {
text-decoration: none;
}

我也尝试过更改为href="DevProject/index.html/style.css/",但通过VS代码"跟随链接"会给我

无法读取文件"c:\DevProject\index.html\DevProject\index.html\style.css\">

我确保编码是UTF-8

我还尝试过像一样分离CSS和HTML文件

Devproject>style.css>style

但错误相同

你犯了一个简单的错误,但我见过初学者犯过很多次。

我建议您首先删除样式表引用末尾的斜杠。

如果您的样式表与index.html文件位于同一目录中,请按照如下所示进行操作。如果您的样式表位于css文件夹中,那么您可以简单地将其更改为<link rel="stylesheet" href="css/style.css">。此外,type="text/css"不是必需的。

<!DOCTYPE html>
<html>
<head>
<title>Test Title</title>
<link href="style.css" rel="stylesheet">
</head>
<body>
<h1>H1 text</h1>
<p>I'm learning to code on Codecademy! My goals include:</p>
<ul>
<li>Goal 1</li>
<li>Goal 2</li>
<li>Goal 3</li>
</ul>
</body>
</html>

希望这能有所帮助。

最新更新