HTML导入外部CSS文件失败，求排查原因

嘿，别担心，这种小失误太常见了——我刚接触前端的时候也踩过类似的坑！先直接说最关键的问题：你的<link>标签里的rel属性值写错了！

你写的是：

<link type="text/css" rel="spreadsheet" href="DeveloperLogMain.css">

正确的rel属性值应该是stylesheet（样式表），而不是spreadsheet（电子表格），浏览器就是因为这个识别不了这是个CSS文件引用！

修正后的<link>标签应该是：

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

另外，再给你几个后续排查的小要点，万一改完还是有问题可以试试：

• 确认CSS文件DeveloperLogMain.css和HTML文件在同一个文件夹里，如果不在同一目录，href要写对相对路径（比如./css/DeveloperLogMain.css这种）
• 注意文件名的大小写！比如Windows系统不区分大小写，但如果是部署到Linux服务器上，DeveloperLogMain.css和developerlogmain.css会被当成两个不同的文件
• 有时候浏览器会缓存旧的资源，按Ctrl + F5强制刷新页面，看看是不是缓存导致的问题

最后贴一下你修正后的完整HTML代码，方便你直接对比：

<html> 
<head> 
  <script type="text/javascript" src="DeveloperLogMain.js"></script> 
  <link type="text/css" rel="stylesheet" href="DeveloperLogMain.css"> 
</head> 
<body id='body'> 
  <div id='head'> 
    <h1 id='title'><b>Developing Log</b></h1> 
  </div> 
  <br><br><br><br> 
  <div id='navbar'> 
    <ul> 
      <li><a href='#'><b>Home</b></a></li> 
      <li><a href='#'><b>HTML</b></a></li> 
      <li><a href='#'><b>CSS</b></a></li> 
      <li><a href='#'><b>JavaScript</b></a></li> 
    </ul> 
  </div> 
  <div id='footcontainer'> 
    <footer id='footer'><b>End Of Log</b></footer> 
  </div> 
</body> 
</html>

内容的提问来源于stack exchange，提问作者J D