Question

我一直试图将我的外部样式表链接到我的html一段时间，我似乎无法实现它。我将这两个文件保存在桌面上的同一文件夹中，并使用文本管理器进行编写。我可以看到当我在finder中提取它时页面应该是什么样子但是当我在浏览器中打开网站时它只响应我的html。

这就是我正在使用的（更新）：

<!DOCTYPE html>
<html lang="en">
<head>
<title>Nathan Langer</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="website/style.css"/>
</head>
<header>
<h3>For proffesional and creative video and media production</h3>
</header>

<body>
<div id="name">
    <h1>Nathan Langer</h1>
</div>
</body>

<footer>
<nav>
    <a href="resume.html">Resume</a>
    <a href="portfolio">Portfolio</a>
    <a href="aboutme">What I Do</a>
</nav>
</footer>

</html>

这是我的css：

body {
    background-image: url(images/cool.png);
    background-repeat: no-repeat;
    background-position: center;
}

#name {
    text-align: center;
    font-size: 50px;
    color: white;
    }

nav {
position: center;
}
nav a:hover {text-decoration:none ;}
nav a:visited {color: rgb(256,256,256) ;}
nav a:link {
text-decoration:none ;
color: rgb(256,256,256) ;
    }

Answer 1

那么，你能给我们你的css文件吗？

OLD POST ingnore this part

我现在可以说的是你忘记关闭标签了。所以用这个替换它

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

之后，在css中更改你的h1风格

h1 {
    color:#FF0000;
    font-size: 30px;
}

这应该可以做到！

NEW PART（在给出css之后）

现在看起来你有以下文件夹结构（如user3291093所述）

index.html (or whatever your page is called)
website (folder)
  |
  ----> style.css
  ----> images (folder)
    |
    ----> cool.png

我已经在我的计算机上测试了你的代码，如果我将它放在aboce文件夹结构中，你的代码就可以了。您应该在网络浏览器（Chrome，Firefox）中查看源代码，看看css文件的链接是否真的有效（或者使用浏览器的开发工具）

希望这会有所帮助：）

Answer 2

一切看起来都不错。我看到的唯一问题是你可能正在使用存储css文件的目录的无效路径:(示例：它在名为＆＃34的文件夹中;文件夹＆＃34;）

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

以下是其他文件路径的简要说明：

./表示当前目录

../表示当前目录的父目录，而不是根目录

/是根目录

myfile.text位于当前目录中，./myfile.text

也是如此

../myfile.text比您高出一级，/myfile.text位于您的根目录中。

要避免此问题，您可以直接链接到样式表，如下所示：

<link rel="stylesheet" type="text/css" href="http://www.website.com/style.css"/>

外部样式表不会链接

2 个答案: