Question

刚开始一个新的HTML项目并随时学习，但我似乎无法弄清楚为什么我的代码没有连接起来。我试图让我的照片100％宽度的屏幕，我意识到我的代码并没有排成一行。

请问任何建议？

这是我的HTML：

<!DOCTYPE html>
<html>
<head>

<title>liz project</title>

<LINK rel="stylesheet" type="text/css" href="stylesheet.css" media="screen">


</head>
<body>

<h1>my first project</h1>
<p> welcome to the best site on the planet woohoo <br>
<img class="bg" src="http://blissmakedesign.com/wp-content/uploads/2012/11/livingroom1.jpg"> </p>

这是我的CSS：

h1 {font-family: arial; color: red }

.bg {width: 100%; margin-right: auto; margin-left: auto }

超级基础，刚开始。非常感谢！

Answer 1

我建议您了解如何使用文件路径。

quick reminder about file path

以“/”开头，返回根目录并从那里开始
以“../”开头向后移动一个目录并从那里开始
以“../../”开头，向后移动两个目录并启动那里（等等......）
要继续前进，只需从第一个子目录开始并保持前进

因此，请确保您的文件路径方向正确。

Answer 2

你已经拥有了很多东西，就像其他人已经说过它会像CSS文件一样无法找到。这可能是因为它位于文件夹内，而不是HTML文件的根目录？

在这种情况下，您只需要更改CSS文件的链接以反映其中的文件夹

<link rel="stylesheet" type="text/css" href="/[folder name]/stylesheet.css">

注意我已经删除了media="screen"，对于基本教程，您不会真的需要它，所以我不会担心它。

另请注意，在开始时我使用了link的lowecase。我不知道这是否会导致您的问题，但除非您需要大写，否则值得尝试坚持使用小写字母。

最后一点，我不确定你真的需要margin-left:auto和margin-right:auto，因为你的图像被分类占据了宽度的100％，所以赢得了＃t是任何可用的利润。如果愿意，可以在CSS文件中删除这些声明。

您能否向我们展示一个关于文件和文件夹如何布局的简短示例？

Answer 3

我同意Lee和C-link尼泊尔。它可能是路径错误，因此请确保您的样式表与html页面位于同一目录中。将来，您可以通过右键单击元素并选择＆＃34; Inspect Element＆＃34;来检查浏览器上存在问题的页面。或类似的东西。在检查窗格中，您可以检查是否找不到任何文件，这可能会指向正确的方向。

基本HTML：外部样式表不链接

3 个答案: