我如何正确地将我的 css 和 html 文件链接在一起，检查元素显示

我如何正确地将我的 css 和 html 文件链接在一起，检查元素显示

我已经尝试了HTML 不加载 CSS 文件的所有方法，但它们似乎不起作用。当我尝试检查 chrome 上的元素时，他们告诉我

“无法加载资源：net::ERR_FILE_NOT_FOUND”。

这是我的文件结构

C>DevProject>index.html
在我的index.html 中有两个项目，其中一个“index”是我的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

但同样的错误

RISEBY

浏览 76回答 1

1回答

斯蒂芬大帝

你犯了一个简单的错误，但我已经看到初学者多次犯过这个错误。我建议您首先删除样式表引用末尾的尾部斜杠。如果您的样式表与 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>希望这可以帮助。

0

0

随时随地看视频慕课网APP

相关分类

Html5