0

所以我一直在学习 CodeAcademy 上的课程(我知道很蹩脚,但这是一个步骤),现在我对编写自己的 HTML/CSS 感到很自在。但是,我发现当我开始这样做(我一直在使用 sublimetext 3)并打开我的 html 文件时,没有应用 css。我再次尝试使用来自 codeacademy 的一些有效的代码,Chrome 再次显示纯 html。这是我的文件中的代码

模板.html

<!DOCTYPE html>
<html>
    <head>
        <link type="text/css" rel="stylesheet" href="stylesheet.css"/>
        <title>Strut Your Stuff!</title>
    </head>
    <body>
        <p>I'm about to become a lovely shade of teal.</p>
        <p>Me, too!</p>
        <p>I think I'll do the same.</p>
        <div>
            <p>We're going to become a truly striking scarlet!</p>
            <p>I was thinking more vermillion.</p>
            <p>No, crimson!</p>
        </div>
    </body>
</html>

和 stylesheet.css

p{
    color:#00E5EE;
}
div p{
    color:#CC0000;
}
*{
    border:1px dashed #3A5FCD;
}

这两个文件位于同一目录中。如果你们能分享任何关于正在发生的事情的见解,那将对我有很大帮助。提前致谢。

更新:我发现简单地重新加载页面是行不通的。我需要打开一个新选项卡并重新输入目录。

4

3 回答 3

0

问题是重新加载页面根本不起作用。我会创建样式表,然后点击重新加载按钮。我需要做的是打开一个新选项卡并再次粘贴 html 文件的目录。感谢您的所有见解

于 2013-08-14T01:35:12.103 回答
0

作为初学者,您需要了解“开发人员工具”是调试此类问题时最好的朋友。

如果您在 Chrome 中按 F12 键,这将打开开发者工具,这在调试 Web 问题方面非常有用。

如果您单击开发人员工具的“网络”选项卡并刷新屏幕,您可以看到您的页面发出的所有请求以及返回的内容。根据您对问题的描述 - 您很可能会在 .css 文件的状态下看到“404” - 这意味着无法找到它,很可能是因为您的文件名错误或路径错误。

如果单击元素选项卡,您可以在页面上看到元素的分层视图。您可以选择其中一个,然后在右侧查看应用到它的样式。这将让您查看哪些(如果有)css 规则应用于给定元素。

于 2013-08-14T01:41:47.840 回答
-1

尝试将样式表嵌入到头部的 html 文件中

<style TYPE="text/css">
<!--
p{
    color:#00E5EE;
}
div p{
    color:#CC0000;
}
*{
    border:1px dashed #3A5FCD;
}
-->
</style>

如果这有效(这将有效...),那么您将需要检查 html 和 css 文件的路径。在浏览器上运行您的 html 并检查 url。然后将 template.html 替换为 stylesheet.css 并查看您的样式表是否出现。如果不是,那将是文件路径问题。让我们知道这是怎么回事

于 2013-08-14T01:28:15.197 回答