Question

谢谢你宝贵的时间; 我是网络开发的初学者，因为我正在尝试html和CSS 我发现css样式没有应用于html和chrome 开发人员工具显示它是空的（文件存在但我在css文件中编写的代码似乎不存在）请帮忙！

Screenshot of the problem.

index.html文件

<!DOCTYPE html>
<html>
<head>
  <title>MY WEB PAGE </title>
  <link type="text/css" href="style.css"  rel="stylesheet" >
</head>
  <body>
  <h1>THIS IS MY WEB PAGE </h1>
    <p>
    css applied to this part of the code isnt being shown in the developers
    tools
    </p>
  </body>
</html>

style.css文件

body{
  background-color:black;;
}
h1{
  color:white;
  font-style: italic;
  font-family: sans-serif;
}
p{
  font-family: serif;
  color:yellow;
  font-style: oblique;
}

Answer 1

您的第一行可能缺少一个尖括号，或者可能是复制粘贴错误。它应该是：<!DOCTYPE html>

另请查看Chrome工具栏中的“网络”标签，确保它能够找到您的style.css并且它包含正确的CSS。

根据托管方式的不同，您可能需要按Ctrl-F5告诉浏览器下载所有内容而不是缓存。

Answer 2

你必须将css和html文件保存在与writed相同的文件夹中

Google Chrome开发者工具-CSS文件显示为空

2 个答案: