Html 为什么CSS文件没有显示出来？_Html_Css

Html 为什么CSS文件没有显示出来？

html css

Html 为什么CSS文件没有显示出来？,html,css,Html,Css,我仔细检查了链接HTML文件中CSS文件的语法，在我看来都是正确的。当我查看HTML页面的页面源代码时，确实需要正确链接到CSS页面。但这些款式似乎都没有出现。我相当肯定CSS文件的链接是好的，但我不明白为什么没有出现任何更改 HTML文件： <!DOCTYPE html> <html> <head>  <title>Midt

我仔细检查了链接HTML文件中CSS文件的语法，在我看来都是正确的。当我查看HTML页面的页面源代码时，确实需要正确链接到CSS页面。但这些款式似乎都没有出现。我相当肯定CSS文件的链接是好的，但我不明白为什么没有出现任何更改

HTML文件：

<!DOCTYPE html>
<html>
<head>
    <!--title to appear on the tab of the browser-->
    <title>Midterm: Hangman</title>

    <!--linking a CSS style sheet for the page--> 
    <link rel="stylesheet" type="type/css" href="hangman.css">

    <!--running the hangman game-->
    <script src="hangman.js"></script>
</head>

<!--run the main function from the javascript file when page is loaded-->
<body onload="javascript:hideWord()">
    <!--adding a title that will appear on the webpage-->
    <h1>Hangman</h1>

    <!--create a text box, restrict to only one letter being able to be typed, create placeholder text-->
    <input id="guessedLetter" type="text" maxlength="1" minlength="1" placeholder="Guess a letter" />

    <!--create a button to submit guessed letter and run the compareLetter function when clicked-->
    <button type="button" onclick="javascript:compareLetter()">Guess!</button>


    <button type="button" onclick="javascript:hideWord()">Restart</button>

    <!--underscores to hide the word that the player is guessing-->
    <div id="hiddenWord"></div>

    <!--a counter to keep track of number of player attempts-->
    <p id="counter"></p>

    <!--add instructions for the player-->
    <h2>Instructions</h2>
    <p>Put some instructions here!</p>

</body>
</html>

CHROME开发者工具的屏幕截图：

文件夹结构的屏幕截图：

如果CSS页面链接到html页面，而您没有看到更新，则这可能是一个兑现问题。在Google Chrome中，右键单击页面并单击“检查”。然后，在inspector打开后，导航到地址栏附近的页面顶部，右键单击刷新图标。然后选择“空缓存和硬重新加载”。

您有一个输入错误：

<link rel="stylesheet" type="type/css" href="hangman.css">

您有一个输入错误：

<link rel="stylesheet" type="type/css" href="hangman.css">

您应该使用。

浏览器的“开发人员工具”窗口的“网络”选项卡显示了什么？css文件相对于html文件在哪里？onclick=javascript:compareLetter>不起作用。仅在href=中使用javascript:URI方案，对于onclick，您可以直接将脚本放在那里：onclick=compareLetter。CSS文件是否与此HTML文件位于同一目录中？你能发布CSS吗？@Dai当我打开工具时，它显示html和javascript页面，但我看不到文件夹中的CSS文件，即使它们都在我的计算机上的同一个文件夹中。浏览器的“开发人员工具”窗口的“网络”选项卡上显示了什么？css文件与html文件的关系在哪里？onclick=javascript:compareLetter>不起作用。仅在href=中使用javascript:URI方案，对于onclick，您可以直接将脚本放在那里：onclick=compareLetter。CSS文件是否与此HTML文件位于同一目录中？你能发布CSS吗？@Dai当我打开工具时，它会显示html和javascript页面，但我看不到文件夹中的CSS文件，即使它都在我的计算机上的同一个文件夹中。嗯，运气不好：似乎仍然忽略CSS表等等，忽略样式表是什么意思？没有任何更改出现，例如背景色等。但是，当我查看页面源代码时，我可以看到它正确链接到CSS文件。因此，样式表中根本没有样式？是的。它只是没有显示在HTML页面上，但文件似乎链接正确。嗯，不走运：仍然似乎忽略了CSS表单等等，忽略样式表是什么意思？没有任何更改出现，如背景色等。但是，当我查看页面源代码时，我可以看到它正确地链接到CSS文件。所以，样式表中根本没有样式？是的。它只是没有显示在HTML页面上，但文件似乎链接正确。好地方！我没注意到啊！哦，哇…非常感谢你！哦，一个小小的打字错误会让人头疼，哈哈哈，我们每个人都会这样！好地方！我没注意到啊！哦，哇…非常感谢你！哦，一个小小的打字错误会让人头疼，哈哈哈，我们每个人都会这样！

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

<link rel="stylesheet" href="hangman.css">